Adding a side banner to RT_Cerulean
-
-
- whizzz
- Newbie
- Posts: 2
- Thanks: 0
-
Dear Rockettheme-Team,
Our page: www.beachmania.ch
Used Template: Rt_cerulean
Our customer asked us to add a side banner on the right. It should be exactly like the side banner on www.lauberhorn.ch (Swiss Ski).
We've already spend several hours on that, but we could not figure it out. Therefore, we've added a image floater. Unfortunately, this does not fulfill the customer's needs. It must be identical as on lauberhorn.ch.
It should stick at the right side of the page and not on the window nor should it float.
Anyway, is there a way how we can solve this issue? It would be great, if we could simply add a new module (column) position there. We've already tried to add a module position as described in www.gantry-framework.org/documentation/joomla/customize , but it switched back to the page as soon as the window was smaller.
At the end, it should look like that:
This image is hidden for guests.
Please log in or register to see it.
We would really appreciate if you could have a look at this.
Thank you very much.
Best regards from Switzerland
Fabian
-
-
-
- Who?
- Preeminent Rocketeer
- Posts: 25562
- Thanks: 613
- Joomla freelancer
-
Add this to your custom stylesheet file and you will have banner as you need it
Check this to learn how to use Firebug to debug and customize templates
www.rockettheme.com/blog/coding/1767-bas...omizing-with-lesscss
div#floater_right { right: 150px !important; top: 20px !important; }
This is how you create a custom stylesheet file...
www.gantry-framework.org/documentation/j...custom_stylesheet.md
When we release upgrades template files will change and you will have to reapply all your changes again (that's if you can remember where they all are). If you keep your changes in a separate Custom CSS file you'll have no issues upgrading. -
The following users have thanked you: whizzz
- Check my services at: Mihha-Vision
-
-
-
- whizzz
- Newbie
- Posts: 2
- Thanks: 0
-
Thank you Igor,
We've implemented this code exactly as you described. Unfortunately, it doesn't stick exactly at the same place all the time. Depending the screen size, it's still moving on the horizontal axis. Enclosed, you may see 4 examples:
This image is hidden for guests.
Please log in or register to see it.
Can we add another code-line to fix this?
We had to deactivate this ad, but soon, there will be another one. In order to be able to test it, we moved the banner to the english area (not visible for external visitors): www.beachmania.ch/index.php/en/
Thank you again for your help! We really appreciate this!
-
-
-
- Who?
- Preeminent Rocketeer
- Posts: 25562
- Thanks: 613
- Joomla freelancer
-
I can't develop your website for you
The way around this is to use media queries/* Smartphones */ @media (max-width: 480px) { } /* Smartphones to Tablets */ @media (min-width: 481px) and (max-width: 767px) { } /* Tablets */ @media (min-width: 768px) and (max-width: 959px) { } /* Desktop */ @media (min-width: 960px) and (max-width: 1199px) { } /* Large Display */ @media (min-width: 1200px) { } - Check my services at: Mihha-Vision
-
Time to create page: 0.071 seconds