Announcement

Collapse
No announcement yet.

Social Media buttons

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Social Media buttons

    As well as the Facebook and Twitter links that appear by the individual posts, it would be good to be able to add the main icon buttons for Facebook, Twitter and other social media to the pages of the forum. Ones which link through to our own accounts on those platforms rather than share buttons for members to repost. Can we do this in Cloud and control where on the page they are placed?

    Thank you

  • #2
    You can do this with an HTML module as seen on the front-page of this site. I'll have to look up the instructions on how I did that though. I don't have them readily available.
    Translations provided by Google.

    Wayne Luke
    The Rabid Badger - a vBulletin Cloud demonstration site.
    vBulletin 5 API

    Comment


    • Ston3y1
      Ston3y1 commented
      Editing a comment
      Wayne Luke have you been able to dig around for this at all?

    • Wayne Luke
      Wayne Luke commented
      Editing a comment
      The code used in the HTML Module here is this:

      HTML Code:
      <div style="text-align:center">
          <a href="http://www.facebook.com/vbulletin" alt="Visit us on Facebook"><span class="b-icon b-icon__facebook-24">&nbsp;</span></a>
          <a href="http://www.twitter.com/vbulletin" alt="Visit us on Twitter"><span class="b-icon b-icon__twitter-24">&nbsp;</span></a>
      </div>
      The page/account I link to is hardcoded. It uses images that already exist in vBulletin's default sprite. You can use your own images by uploading them via the vBCloud File Manager in your AdminCP.

    • Ston3y1
      Ston3y1 commented
      Editing a comment
      That's great, thank you.

  • #3
    Wayne Luke : The page/account I link to is hardcoded. It uses images that already exist in vBulletin's default sprite. You can use your own images by uploading them via the vBCloud File Manager in your AdminCP.
    I have saved some images for social media buttons and tried to load the HTML module with them but it came up blank. I obviously broke the code trying to include the core/css/.png files name for the button. Can you let me know how/where I should include the file name from File Manager instead of the element that links to the vBulletin images?

    I had just assumed it would go where I've bolded, but with it being a File Manage png reference, it might be different?

    <a href="http://www.facebook.com/vbulletin" alt="Visit us on Facebook"><span class="b-icon b-icon__facebook-24">&nbsp;</span></a>

    Comment


    • Ston3y1
      Ston3y1 commented
      Editing a comment
      No worries, I tried a few more things and found the <img src="core/css... coding worked.

    • Wayne Luke
      Wayne Luke commented
      Editing a comment
      The Facebook and Twitter links on that site do not use traditional images (PNG, GIF, JPEG). They are background SVG images provided in the standard SVG template that comes with vBulletin. SVG is an XML schema that tells the browser how to draw images. The SVG instructions are stored as text.

      Facebook and Twitter are the only social media SVG images provided by default. That is because the images are used for the third-party logins that are provided with the software. Custom images will either need their own custom SVG & CSS or the use of the <img> tag.

    • Ston3y1
      Ston3y1 commented
      Editing a comment
      No it's fine, I created my own images, loaded them to File Manager and used an <img src code to link each hyperlink to them. Thanks for all your help with this.

Related Topics

Collapse

Working...
X