Announcement

Collapse
No announcement yet.

Add small graphic to Right-side of Footer

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

  • [vB5] Add small graphic to Right-side of Footer

    Hi all,

    I'd like to add a small graphic, say about 50across x 10high so it sits over the right end of the footer bar always, and preferably doesn't move even with window resizing.

    It would need to be just after the "Go to Top" or just prior to the "Help" texts, but preferably after not before.

    I don't understand CSS but can follow basic instructions for editing code. This is a completely new installation and I've been editing the 'Blue & Yellow' skin.
    VB 5.2.6 - PHP 5.6.19 - MySQL 5.5.50 - No Addons - none at all.

  • #2
    CSS can't create HTML structures. You will most likely need to edit the footer template or use a template hook to add your image. Do you know basic HTML commands?
    Translations provided by Google.

    Wayne Luke
    The Rabid Badger - a vBulletin Cloud site. vBulletin 5 API - Full / Mobile
    Please do not PM me for support unless I specifically ask for information to be delivered that way.

    Comment


    • #3
      Originally posted by Wayne Luke View Post
      Do you know basic HTML commands?
      I can follow the gist and make functional edits, but I'm more of a tweaker than a programmer where HTML is concerned. I still don't understand what the 'hook' is let alone competent enough to manipulate/create one.
      VB 5.2.6 - PHP 5.6.19 - MySQL 5.5.50 - No Addons - none at all.

      Comment


      • #4
        Probably not the best solution but I was able to create this with the following steps...
        Click image for larger version

Name:	snip_20170323110439.png
Views:	1
Size:	26.9 KB
ID:	4366984
        1. Go to Styles -> Style Manager.
        2. On the Style Options dropdown for your style select "Add New Template".
        3. Name this new template something like 'footer_image'
        4. Add the code below
        5. Save the template
        Code:
        <div class="footer_img"><img src='someimage.png' height='10' width='50'></div>
        <div style="clear:both"></div>
        1. Next edit your css_additional.css template in the style.
        2. Add the code below.
        3. Save the template.
        Code:
        .footer_img {float:right;height:10px;width:50px;border:1px solid black;background-color:red;overflow:hidden}
        1. Finally, go to Products & Hooks -> Manage Template Hooks.
        2. Click "Add new template hook".
        3. Set "Hook is Active" to Yes.
        4. Set "Hook Location" to footer_start
        5. Set the "Title" to Footer Image
        6. Set "template" to footer_image (or whatever name you used above).
        7. Save this hook.

        It should show up on the next page refresh.
        Translations provided by Google.

        Wayne Luke
        The Rabid Badger - a vBulletin Cloud site. vBulletin 5 API - Full / Mobile
        Please do not PM me for support unless I specifically ask for information to be delivered that way.

        Comment


        • #5
          Thanks, Wayne.

          Is there any basic means to add it so it looks more like position A or position B?



          VB 5.2.6 - PHP 5.6.19 - MySQL 5.5.50 - No Addons - none at all.

          Comment

          Working...
          X