1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Forum layout issue

Discussion in 'Styling and Customization Questions' started by Neil E., Dec 31, 2012.

  1. Neil E.

    Neil E. Active Member

    At this point, I thought I'd be working on a final color scheme, but I still have much to learn about XF. I did not go with a predefined style since I wanted to learn how to do this stuff myself. I have NO prior experience with HTML, CSS or templates. This XF support forum has been very helpful (the only formal computer training I have is from the days of key punch terminals and card readers).

    I have come up with a layout I like, but the major issue is appearance on different browsers and at different resolutions. This is the forum location: www.odsc.on.ca/.xenforo/index.php

    I added an image at the top of the forum and also a rotating ad beside the logo. These are giving me the most trouble. New template forum_image_top contains:
    This is inserted into XF template logo_block as follows:
    Rotating ads are done using XF template ad_header as follows:
    Here is the matching CSS:

    Actual problems:

    1) Depending on the browser (eg IE vs IE 64bit etc.) I get a situation where the content doesn't move down to match the added height of the top image. This places the breadbox in conflict with the NavTabs. Also the fonts in a couple of the NavTabs go nutty.

    2) When I use Firebug to inspect the page, the rotating ad links appear in multiple locations. The actual page looks fine.

    I'm hoping someone can explain these oddities or perhaps a better way to achieve the layout I want.
     
  2. Neil E.

    Neil E. Active Member

    The extra rotating ad links are what's bugging me the most. I can't figure out where they are coming from.

    xenforo91.jpg
     
  3. Jon W

    Jon W Well-Known Member

    Looks like you have some dodgy HTML in there that is causing the browser to spit out extra links:
    HTML:
    <a href="http://www.trailtekadv.com" target=_blank</a><img src="http://www.odsc.on.ca/.xenforo_added_Neil/banner_ads/ADV.jpg" />
    Shouldn't it be something more like:
    HTML:
    <a href="http://www.trailtekadv.com" target="_blank"><img src="http://www.odsc.on.ca/.xenforo_added_Neil/banner_ads/ADV.jpg" /></a>
     
  4. Neil E.

    Neil E. Active Member

    I totally agree that something is dodgy and I was hopeful your idea was right, but no go.
    One small point is that target=_blank should be target="_blank" to be correct.


    original code (generates multiple links)

    Waindigo code (generates single link only, but then image does not show)

    alternate try with </a> inside </xen:set> (same result, generates single link only, but image does not show)

    At this point I'm hoping that once Jake has finished his New Year's partying, he will provide some wisdom.
    What I have done is based on his code http://xenforo.com/community/resources/display-a-random-banner.375/


    I suspect that the <xen:set var=$banners.1"> </xen:set> cannot support a link. It works fine with images only.
    Does anyone else have this working with links included?
     
  5. Jon W

    Jon W Well-Known Member

    You have copied my code incorrectly. In fact you've made 3 mistakes:
    • I didn't include the <xen:set> tag in my code, and you have then added it to my code incorrectly by putting the </xen:set> tag before the </a>.
    • I also included a > after "_blank" which you have missed. This is what was causing your issue.
    • I put "_blank" and not _"blank".
    You should have:
    HTML:
    <xen:set var="$banners.1"><a href="http://www.trailtekadv.com" target="_blank"><img src="http://www.odsc.on.ca/.xenforo_added_Neil/banner_ads/ADV.jpg" /></a></xen:set>
     
  6. Neil E.

    Neil E. Active Member

    Sorry, you are absolutely correct.

    target="_blank" was meant to be a comment on my own mistake.
    I didn't actually do a physical copy of your correct code (just typed what I thought I had noticed as the changes; not much wonder it still didn't work).
    The missing '>' was definitely the cause of all my problems.

    Thanks for the assistance, I am humbled by all the knowledge that is handed out to beginners.
     
    Jon W likes this.

Share This Page