Skip to content

Social icon (Nodebb)

Solved Customisation
  • Hi Mark,

    This title may not be relevant so feel free to change it.

    I’m looking to add an image so when I post to social profiles etc it displays an image instead of the NodeBB logo.

    How do I achieve this?

    Many thanks

  • @jac Good question. I raised something similar on the NodeBB community

    https://community.nodebb.org/topic/15650/default-image-when-sharing-topics-posts

    but, I never got a response 😠 - however, there is an OG image (Open Graph) which you can apply at

    /admin/settings/general

    Which (I think) should give you a default image (which you of course specify by uploading) for sharing on social media.

    EDIT - on checking, this does indeed work. Once the image is applied, the Open Graph tags are present in each post - see below

    <meta property="og:title" content="Social icon (Nodebb)" />
    <meta property="og:description" content="@jac Good question. I raised something similar on the NodeBB community   	  	 		 			  				 					                                                          May 11  /  Technical Support                                                                         ..." />
    <meta property="og:type" content="article" />
    <meta property="article:published_time" content="2021-12-04T16:58:18.479Z" />
    <meta property="article:modified_time" content="2021-12-04T17:28:05.608Z" />
    <meta property="article:section" content="Customisation" />
    <meta property="og:image" content="https://sudonix.com/assets/uploads/profile/1-profileavatar-1629822570834.png" />
    <meta property="og:image:url" content="https://sudonix.com/assets/uploads/profile/1-profileavatar-1629822570834.png" />
    <meta property="og:image" content="https://sudonix.com/assets/uploads/system/og-image.png" />
    <meta property="og:image:url" content="https://sudonix.com/assets/uploads/system/og-image.png" />
    <meta property="og:image:width" content="1900" />
    <meta property="og:image:height" content="950" />
    <meta property="og:url" content="https://sudonix.com/topic/162/social-icon-nodebb/2" />
    
  • @phenomlab said in Social icon (Nodebb):

    @jac Good question. I raised something similar on the NodeBB community

    https://community.nodebb.org/topic/15650/default-image-when-sharing-topics-posts

    but, I never got a response 😠 - however, there is an OG image (Open Graph) which you can apply at

    /admin/settings/general

    Which (I think) should give you a default image (which you of course specify by uploading) for sharing on social media.

    EDIT - on checking, this does indeed work. Once the image is applied, the Open Graph tags are present in each post - see below

    <meta property="og:title" content="Social icon (Nodebb)" />
    <meta property="og:description" content="@jac Good question. I raised something similar on the NodeBB community   	  	 		 			  				 					                                                          May 11  /  Technical Support                                                                         ..." />
    <meta property="og:type" content="article" />
    <meta property="article:published_time" content="2021-12-04T16:58:18.479Z" />
    <meta property="article:modified_time" content="2021-12-04T17:28:05.608Z" />
    <meta property="article:section" content="Customisation" />
    <meta property="og:image" content="https://sudonix.com/assets/uploads/profile/1-profileavatar-1629822570834.png" />
    <meta property="og:image:url" content="https://sudonix.com/assets/uploads/profile/1-profileavatar-1629822570834.png" />
    <meta property="og:image" content="https://sudonix.com/assets/uploads/system/og-image.png" />
    <meta property="og:image:url" content="https://sudonix.com/assets/uploads/system/og-image.png" />
    <meta property="og:image:width" content="1900" />
    <meta property="og:image:height" content="950" />
    <meta property="og:url" content="https://sudonix.com/topic/162/social-icon-nodebb/2" />
    

    Thanks very much mate, I’ll try this tomorrow.

  • JACundefined JAC referenced this topic on
  • @phenomlab said in Social icon (Nodebb):

    @jac In addition, see this

    https://community.nodebb.org/post/86245

    73027e22-1ffa-42a9-8271-54a5c50f599a-image.png

    That’s a good shout mate 😁😁

  • @jac I just tested my theory around using the OG image, and according to the Twitter card validator, it works fine

    73e805e1-997b-41bf-9259-51c5052ca8fc-image.png

  • @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

    73e805e1-997b-41bf-9259-51c5052ca8fc-image.png

    fixed 🙂

  • phenomlabundefined phenomlab has marked this topic as solved on

Did this solution help you?
Did you find the suggested solution useful? Why not buy me a coffee? It's a nice gesture, and a great way to show your appreciation 💗

  • Nodebb design

    Solved General
    2
    1 Votes
    2 Posts
    146 Views

    @Panda said in Nodebb design:

    One negative is not being so good for SEO as more Server side rendered forums, if web crawlers dont run the JS to read the forum.

    From recollection, Google and Bing have the capability to read and process JS, although it’s not in the same manner as a physical person will consume content on a page. It will be seen as plain text, but will be indexed. However, it’s important to note that Yandex and Baidu will not render JS, although seeing as Google has a 90% share of the content available on the web in terms of indexing, this isn’t something you’ll likely lose sleep over.

    @Panda said in Nodebb design:

    The “write api” is preferred for server-to-server interactions.

    This is mostly based around overall security - you won’t typically want a client machine changing database elements or altering data. This is why you have “client-side” which could be DOM manipulation etc, and “server-side” which performs more complex operations as it can communicate directly with the database whereas the client cannot (and if it can, then you have a serious security flaw). Reading from the API is perfectly acceptable on the client-side, but not being able to write.

    A paradigm here would be something like SNMP. This protocol exists as a UDP (UDP is very efficient, as it is “fire and forget” and does not wait for a response like TCP does) based service which reads performance data from a remote source, thus enabling an application to parse that data for use in a monitoring application. In all cases, SNMP access should be “RO” (Read Only) and not RW (Read Write). It is completely feasible to assume complete control over a firewall for example by having RW access to SNMP and then exposing it to the entire internet with a weak passphrase.

    You wouldn’t do it (at least, I hope you wouldn’t) and the same ethic applies to server-side rendering and the execution of commands.

  • NodeBB: Creating pages

    Solved Configure
    9
    0 Votes
    9 Posts
    277 Views

    OK, I think I have figured out how to place a link in the footer which will click to a new page.

  • 0 Votes
    6 Posts
    537 Views

    @cagatay You should ask in the NodeBB forums. Perhaps reference this post

    https://discuss.flarum.org/d/23066-who-read

  • NodeBB inline videoplayer

    Solved Customisation
    12
    3 Votes
    12 Posts
    714 Views

    @phenomlab
    YAY! It works
    Thanks so much

  • 5 Votes
    29 Posts
    2k Views

    @phenomlab said in nodebb chat roll dice game:

    @DownPW I still think you could do something much quicker with jQuery.

    Why not but like I said, I have no skills to do that.

    If you are motivated, why not but I don’t want to bother you especially since it will only be for a certain period of time.

  • Error install plugin

    Solved Customisation
    8
    1 Votes
    8 Posts
    461 Views

    @pobojmoks

    Not WP plugin but nodeBB but it a known bug

  • 2 Votes
    7 Posts
    761 Views

    @phenomlab said in NodeBB changing color of the text:

    @marusaky This ought to to it

    a.permalink, a.permalink:active, a.permalink:focus, a.permalink:hover { color: #ffffff; }

    works great, thanks a lot

  • 0 Votes
    7 Posts
    726 Views

    @downpw ooops. Forgot that. Thanks for adding.