Skip to content

Display tweets in widget [NodeBB]

Solved Customisation
29 2 7.9k 1
  • Itโ€™s probably a long shot, I did think about posting this in the NodeBB forum, but thought Iโ€™d come here first to see if yourself or anyone else knows if this is possibleโ€ฆ

    I wonder if there is a way to get the latest tweets say for a category so โ€˜Wordpressโ€™ for example and display Wordpress tweets or Tweets from the WordPress account if a post is generated in the WordPress category for example.

    Iโ€™m looking to do this with my football forum , so for example The club account Tweets next to the โ€˜Official Club Newsโ€™ topic etc.

    Academy tweets next to academy news etcโ€ฆ

    Many thanks ๐Ÿ‘๐Ÿป

  • @phenomlab wow! How did you manage that? Thatโ€™s brilliant!!

    @jac Very easily done. You just use the HTML widgets and place them where you want ๐Ÿ™‚

  • Itโ€™s probably a long shot, I did think about posting this in the NodeBB forum, but thought Iโ€™d come here first to see if yourself or anyone else knows if this is possibleโ€ฆ

    I wonder if there is a way to get the latest tweets say for a category so โ€˜Wordpressโ€™ for example and display Wordpress tweets or Tweets from the WordPress account if a post is generated in the WordPress category for example.

    Iโ€™m looking to do this with my football forum , so for example The club account Tweets next to the โ€˜Official Club Newsโ€™ topic etc.

    Academy tweets next to academy news etcโ€ฆ

    Many thanks ๐Ÿ‘๐Ÿป

    @jac something like this ?

  • @jac something like this ?

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac something like this ?

    Wow, yes something just like this!

    The only issue is itโ€™s 6 years old that thread but maybe it would still work. Another issue probably could be the width of the tweet/ Twitter profile.

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac something like this ?

    Wow, yes something just like this!

    The only issue is itโ€™s 6 years old that thread but maybe it would still work. Another issue probably could be the width of the tweet/ Twitter profile.

    @jac neither of those will be an issue from what I can see.

  • @jac neither of those will be an issue from what I can see.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac neither of those will be an issue from what I can see.

    Brilliant! Unfortunately like the one earlier Iโ€™ve only just seen this. ๐Ÿ˜•

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac neither of those will be an issue from what I can see.

    Brilliant! Unfortunately like the one earlier Iโ€™ve only just seen this. ๐Ÿ˜•

    Essentially on desktop / tablet Iโ€™m looking to display a widget of the latest tweets but it needs to be categorised so catagory based where it allows you to add a widget, now that is something Iโ€™m not quite sure is possible as a feature, but if it could be done it would be a very welcome addition to the forum indeed!

  • Essentially on desktop / tablet Iโ€™m looking to display a widget of the latest tweets but it needs to be categorised so catagory based where it allows you to add a widget, now that is something Iโ€™m not quite sure is possible as a feature, but if it could be done it would be a very welcome addition to the forum indeed!

    @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

  • @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

    Of course, sounds fantastic! ๐Ÿ˜.

  • @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

    Looking forward to delving deeper into this over the weekend after work ๐Ÿ‘๐Ÿป.

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac I think itโ€™s one of those things weโ€™d need to test first to see what the output is. We can then play with the CSS afterwards.

    Looking forward to delving deeper into this over the weekend after work ๐Ÿ‘๐Ÿป.

    @jac let me know how you get on. Iโ€™m planning something similar in fact.

  • @jac let me know how you get on. Iโ€™m planning something similar in fact.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac let me know how you get on. Iโ€™m planning something similar in fact.

    Great, itโ€™ll be interesting to see both results. I simply plan to display a Twitter profile of the news / content displayed, Iโ€™m hoping it works out although displaying widgets for specific categories could be an issue.

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac let me know how you get on. Iโ€™m planning something similar in fact.

    Great, itโ€™ll be interesting to see both results. I simply plan to display a Twitter profile of the news / content displayed, Iโ€™m hoping it works out although displaying widgets for specific categories could be an issue.

    Still yet to do this. Have you had any success?

    Iโ€™m curious to see how it will look.

  • Still yet to do this. Have you had any success?

    Iโ€™m curious to see how it will look.

    @jac not yet.

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac not yet.

    Did you ever get round to this? I still need to test myself, although I do wonder how it can be done specifically for categories.

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac not yet.

    Did you ever get round to this? I still need to test myself, although I do wonder how it can be done specifically for categories.

    @jac I havenโ€™t done anything with this since we last briefly discussed it. When you say โ€œtweetsโ€ are you referring to content directly from Twitter ?

  • @jac I havenโ€™t done anything with this since we last briefly discussed it. When you say โ€œtweetsโ€ are you referring to content directly from Twitter ?

    @phenomlab I am indeed mate, so for example the โ€˜Stockport Countyโ€™ category content would display a widget that shows the clubโ€™s official tweets or Twitter profile. May not be possible but would definitely be good if it could be pulled off. Itโ€™s just whether this sort of thing would impact load times etc.

  • @phenomlab I am indeed mate, so for example the โ€˜Stockport Countyโ€™ category content would display a widget that shows the clubโ€™s official tweets or Twitter profile. May not be possible but would definitely be good if it could be pulled off. Itโ€™s just whether this sort of thing would impact load times etc.

    @jac As a quick POC I decided to create a Twitter widget on your Categories page - see below for what it looks like

    6f9f9603-6d23-4a9f-bd8b-36d004dee9de-image.png

    Itโ€™s not styled as such yet, but is nothing more than a widget taken from Twitter directly here

    This then gives you the code to place into any widget

    <a class="twitter-timeline" data-height="800" data-dnt="true" data-theme="light" href="https://twitter.com/StockportCounty?ref_src=twsrc%5Etfw">Tweets by StockportCounty</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    

    The widget code is shown as below

    ad9435df-3b43-4c50-bfee-fba908b8a62d-image.png

    Save the widget, and off you go ๐Ÿ™‚

    Clearly, you need to tailor this a little depending on what you actually want to capture, but this is the overall concept.

  • @jac As a quick POC I decided to create a Twitter widget on your Categories page - see below for what it looks like

    6f9f9603-6d23-4a9f-bd8b-36d004dee9de-image.png

    Itโ€™s not styled as such yet, but is nothing more than a widget taken from Twitter directly here

    This then gives you the code to place into any widget

    <a class="twitter-timeline" data-height="800" data-dnt="true" data-theme="light" href="https://twitter.com/StockportCounty?ref_src=twsrc%5Etfw">Tweets by StockportCounty</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    

    The widget code is shown as below

    ad9435df-3b43-4c50-bfee-fba908b8a62d-image.png

    Save the widget, and off you go ๐Ÿ™‚

    Clearly, you need to tailor this a little depending on what you actually want to capture, but this is the overall concept.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac As a quick POC I decided to create a Twitter widget on your Categories page - see below for what it looks like

    6f9f9603-6d23-4a9f-bd8b-36d004dee9de-image.png

    Itโ€™s not styled as such yet, but is nothing more than a widget taken from Twitter directly here

    This then gives you the code to place into any widget

    <a class="twitter-timeline" data-height="800" data-dnt="true" data-theme="light" href="https://twitter.com/StockportCounty?ref_src=twsrc%5Etfw">Tweets by StockportCounty</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    

    The widget code is shown as below

    ad9435df-3b43-4c50-bfee-fba908b8a62d-image.png

    Save the widget, and off you go ๐Ÿ™‚

    Clearly, you need to tailor this a little depending on what you actually want to capture, but this is the overall concept.

    Wow, looks phenomenal mate, is there any way to limit the amount of tweets shown at all? And more specifically how can they be displayed on each category?

  • @phenomlab said in Display tweets in widget [NodeBB]:

    @jac As a quick POC I decided to create a Twitter widget on your Categories page - see below for what it looks like

    6f9f9603-6d23-4a9f-bd8b-36d004dee9de-image.png

    Itโ€™s not styled as such yet, but is nothing more than a widget taken from Twitter directly here

    This then gives you the code to place into any widget

    <a class="twitter-timeline" data-height="800" data-dnt="true" data-theme="light" href="https://twitter.com/StockportCounty?ref_src=twsrc%5Etfw">Tweets by StockportCounty</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
    

    The widget code is shown as below

    ad9435df-3b43-4c50-bfee-fba908b8a62d-image.png

    Save the widget, and off you go ๐Ÿ™‚

    Clearly, you need to tailor this a little depending on what you actually want to capture, but this is the overall concept.

    Wow, looks phenomenal mate, is there any way to limit the amount of tweets shown at all? And more specifically how can they be displayed on each category?

    @jac said in Display tweets in widget [NodeBB]:

    is there any way to limit the amount of tweets shown at all?

    Yes, but only by adjusting the height of the widget itself (via Twitter) from what I recall seeing.

    And more specifically how can they be displayed on each category?

    That part Iโ€™m not so sure of. Iโ€™d say Iโ€™m 99% certain itโ€™ll be possible, but I havenโ€™t invested any time yet to determine this.

  • @jac said in Display tweets in widget [NodeBB]:

    is there any way to limit the amount of tweets shown at all?

    Yes, but only by adjusting the height of the widget itself (via Twitter) from what I recall seeing.

    And more specifically how can they be displayed on each category?

    That part Iโ€™m not so sure of. Iโ€™d say Iโ€™m 99% certain itโ€™ll be possible, but I havenโ€™t invested any time yet to determine this.

    @phenomlab said in Display tweets in widget [NodeBB]:

    @jac said in Display tweets in widget [NodeBB]:

    is there any way to limit the amount of tweets shown at all?

    Yes, but only by adjusting the height of the widget itself (via Twitter) from what I recall seeing.

    And more specifically how can they be displayed on each category?

    That part Iโ€™m not so sure of. Iโ€™d say Iโ€™m 99% certain itโ€™ll be possible, but I havenโ€™t invested any time yet to determine this.

    Thanks Mark, at least itโ€™s there and can be added on when possible ๐Ÿ‘๐Ÿป.


Did this solution help you?
Did you find the suggested solution useful? Support ๐Ÿ’— Sudonix with a coffee โ˜•
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • who is read NodeBB

    Customisation read post nodebb
    6
    0 Votes
    6 Posts
    1k Views
    @cagatay You should ask in the NodeBB forums. Perhaps reference this post https://discuss.flarum.org/d/23066-who-read
  • [NODEBB] Stats

    Unsolved Customisation plugin stats script
    20
    1
    2 Votes
    20 Posts
    4k Views
    @phenomlab said in [NODEBB] Stats: @jac or I land up fixing it I wouldnโ€™t put it past you
  • NodeBB Footer

    Solved Customisation footer nodebb
    10
    1 Votes
    10 Posts
    2k Views
    @phenomlab said in NodeBB Footer: @jac and you. Hope all is well and you recover quickly Thanks pal
  • [NodeBB] username cards

    Solved Customisation nodebb
    8
    5 Votes
    8 Posts
    2k Views
    @phenomlab Ahaโ€ฆnice to know. As always thank you for the reply and information.
  • Social icon (Nodebb)

    Solved Customisation nodebb social
    7
    0 Votes
    7 Posts
    2k Views
    @phenomlab said in Social icon (Nodebb): @jac I just tested my theory around using the OG image, and according to the Twitter card validator, it works fine [image: 1638880098289-73e805e1-997b-41bf-9259-51c5052ca8fc-image.png] fixed
  • NodeBB Design help

    Solved Customisation
    8
    3
    2 Votes
    8 Posts
    2k Views
    @riekmedia Iโ€™ve applied some new CSS to your site. Can you reload the page and try again ? For the record, this is what I added #footer { background: #2d343e; border-top: 4px solid #2d343e; font-size: 0.9em; margin-top: 70px; padding: 80px 0 0; position: relative; clear: both; bottom: 0; left: 0; right: 0; z-index: 1000; margin-left: -15px; margin-right: -338px; } The /categories page seems a bit messed up, so looking at that currently EDIT - issued some override CSS in the CATEGORIES widget <!--- CSS fix for overspill on /categories page - DO NOT DELETE --> <style> #footer { margin-right: -45px; } </style> That should resolve the /categories issue.
  • How to set a signature in NodeBB?

    Solved Customisation
    4
    2 Votes
    4 Posts
    2k Views
    @phenomlab said in How to set a signature in NodeBB?: @jac No issues at all with copying. This is set using the signature for the user you are posting as. In the case of Hostrisk, itโ€™s set like the below [image: 1633427929198-7bf04183-f6e8-4d72-b0eb-c9a05c9cd24b-image.png] You can set the signature by using https://domain.com/user/theuser/edit Mamy thanks Mark, Iโ€™ll set this up later .
  • NodeBB customisation

    Locked Customisation
    332
    27 Votes
    332 Posts
    139k Views
    @jac Given your departure away from your previous project, Iโ€™m going to close this threadโ€ฆ