Skip to content

Social icon (Nodebb)

Solved Customisation
7 2 3.0k 1
  • wrote on last edited by
    #1

    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 JAC

    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

    wrote on last edited by phenomlab
    #2

    @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" />
    
  • @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" />
    
    wrote on last edited by
    #3

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

  • JAC JAC referenced this topic on
  • JAC JAC

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

    wrote on last edited by phenomlab
    #4
  • wrote on last edited by
    #5

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

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

    wrote on last edited by
    #6

    @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

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

    wrote on last edited by
    #7

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

  • phenomlab phenomlab has marked this topic as solved on

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
  • 2 Votes
    1 Posts
    648 Views
    No one has replied
  • Custom Page - nodebb

    Solved Customisation custom-pages nodebb
    13
    2
    5 Votes
    13 Posts
    3k Views
    DownPW
    I’m happy to see this
  • TNG + Nodebb

    General tng genealogy nodebb plugin
    4
    0 Votes
    4 Posts
    2k Views
    phenomlab
    @Madchatthew said in TNG + Nodebb: you have to try and use duck tape and super glue to change something to make it do what you want it to do I couldn’t have put that better myself.
  • Whitespace fixes in Nodebb

    Solved Customisation nodebb
    18
    2
    7 Votes
    18 Posts
    7k Views
    phenomlab
    @Panda Just circling back here with something of an update (which I think you’ll like). I’ve completely restructured the ranking system. There are now less ranks, with a higher point threshold to reach them. More importantly, if you reload the site, you’ll notice that the ranks are now icons. I also removed the “Author” badge, and made this a single icon, which (to me) looks much better.
  • Fresher in Nodebb install

    General nodebb
    24
    15 Votes
    24 Posts
    12k Views
    phenomlab
    @Hari I’ve been reading a lot about APO. Looks impressive.
  • what does sound/mute button do?

    Solved Customisation nodebb
    20
    1
    9 Votes
    20 Posts
    6k Views
    phenomlab
    @crazycells Yeah, looking at the plugin itself, that’s a hard coded limit [image: 3d6dbc10-185b-4102-9470-0c2731a10750-image.png] I’ll probably remove that… eventually…
  • [NODEBB] Scroll Button

    Solved Customisation css javascript html scroll button
    7
    1
    0 Votes
    7 Posts
    3k Views
    phenomlab
    @downpw ooops. Forgot that. Thanks for adding.
  • NodeBB metadata

    Solved Configure nodebb
    4
    2 Votes
    4 Posts
    2k Views
    JAC
    @phenomlab said in NodeBB metadata: @jac Are you sure ? https://www.google.co.uk/search?q=site%3Astockportcounty.fans&sxsrf=AOaemvLwnaZL-PliU_2dBOg_Eo1pMVhBjg%3A1638982328139&source=hp&ei=uOKwYeatBcOsad3yp7AE&iflsig=ALs-wAMAAAAAYbDwyLBSDcG5XYoFCKwQFhgz94wTxOcV&ved=0ahUKEwjm6dX71NT0AhVDVhoKHV35CUYQ4dUDCAk&uact=5&oq=site%3Astockportcounty.fans&gs_lcp=Cgdnd3Mtd2l6EAM6BAgjECc6CwgAEIAEELEDEIMBOg4ILhCABBCxAxDHARCjAjoRCC4QgAQQsQMQgwEQxwEQowI6BQguEIAEOggIABCABBCxAzoFCAAQgAQ6CAguELEDEIMBOgsILhCABBDHARCvAToICC4QgAQQsQM6BQgAELEDOgsILhCABBDHARDRAzoLCAAQgAQQsQMQyQM6BQgAEJIDUABYySZg0CdoAHAAeACAAW2IAa0NkgEEMjMuMpgBAKABAQ&sclient=gws-wiz Fair enough 🤪🤪.