Get Default Theme Banner To Full Width (1170)?

[Ricky Blunda]

Hello people

 

Im using the default bootstrap "Theme configurator" to try and display an ad banner for mobile devices. I've simply replaced one of the default images with one of my own. The image itself is 1170 x 300 and I've also set these values in the module, yet the image is downsized.

 

Did a search on these forums to try and find some help, but all I found was how to make the topp banner full width. I tried, but couldnt adapt that particular code to work for my banner which is hooked to top.

 

Anyone in the know? Much obliged!

[tdr170]

Can you give a link to the shop, make sure Smarty cache for CSS is OFF.

[Ricky Blunda]

Can you give a link to the shop, make sure Smarty cache for CSS is OFF.

 

Absolutely. Right now it's not available in English, but you'll get the idea: www.ra-rely.se

 

Go to it on a mobile phone and you'll see our logo and the top menu. Right under the top menu you'll see the banner Im talking about. Small, beige background with black text, situated on the left side. I'd like to somehow make it fit over the entire width range and, if possible, the height adjusted to up too!

 

Much obliged for any help I can get here

 

EDIT: Smart cache is turned off.

Edited February 2, 2016 by Ricky Blunda (see edit history)

[tdr170]

Ok you can try this it worked on my test site go to modules/themeconfigurator/css and edit hooks.css find the code below and replace with what I posted.

Should be lines 21-50.

 

If you go to Modules positions and then scroll down to display top and move theme configurator to top of list is should display on top of the Menu and search.

I take it you have this disabled for all except mobile.

 

 

 

/* Top hook CSS */

  #htmlcontent_top {

    float: right;

    width: 100%;

    max-width: 1170px;

    padding-left: 5px;

}

  @media (max-width: 1170px) {

    #htmlcontent_top {

      width: 100%;

      max-width: 100%;

      padding-left: 0;

      padding-top: 0px; } }

  @media (max-width: 1170px) {

    #htmlcontent_top ul {

      margin: 0 -5px; } }

  #htmlcontent_top ul li {

    width: 100%;

    margin-bottom: 10px; }

    @media (max-width: 1170px) {

      #htmlcontent_top ul li {

        float: left;

        padding-left: 5px;

        padding-right: 5px;

        width: 100%; } }

    #htmlcontent_top ul li:last-child {

      margin-bottom: 0; }

    #htmlcontent_top ul li img {

      max-width: 100%;

      height: auto; }

[Ricky Blunda]

Hmm, thanks, but it didnt seem to have made any difference.

 

Yes, I have it enabled on mobile only. Tablet and PC are disabled for this module.

 

I edited the file hooks.ccs in the folder (root)/modules/themeconfigurator/css, but the image stays the same. I tried clearing cache, reloading the image from my HDD and resetting the width/height properties in the backoffice GUI to NULL and also setting them to 1170 and 300.

 

Anything else I could try?

[tdr170]

Your sure its hooked to top cause the image looks like it is hooked to home.

 

Enable for PC temporarily so I can see the image in PC.

 

Is cache OFF and Force compile ON.

 

Look at this site and tell me what you see the shepherd banner is the same thing, same code I pasted this is where I tested.

Edited February 3, 2016 by tdr170 (see edit history)

[Ricky Blunda]

Hey hey

 

It's not that I dont appreciate the help (which I really do), but I settled for a workaround using the default slider to place the banner instead.

 

Again, thanks for your time and trouble!