change of imageBg alters menu styling

Rate this topic: Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.Evaluations: 1, 1.00 on the average.1.00 out of 6 based on 1 vote(s)
GK User
Sat Apr 06, 2013 9:12 am
Reply with quote
Report this post
I'm experiencing a problem after changing the header image (imageBg) on several of my site's pages. Much of the menu styling is lost.

On the demo site, the background for the menu at the top of the page is transparent; it then switches to a white background as you scroll down the page. However, this styling (defined in the menu.css file) is attached to imageBg. Once the image is changed - and when multiple pages use different header images this is necessary - all menu styling is lost and defaults to the standard page styling.

Can you please suggest a fix for this? It seems to be an oversight in the styling.

Thanks.
User avatar
Junior Boarder

Konrad M
Sun Apr 07, 2013 8:28 pm
Reply with quote
Report this post
User avatar

GK User
Mon Apr 08, 2013 3:22 am
Reply with quote
Report this post
Ho Konrad

Thanks for your reply.

The amount of css edits to add a page seems really onerous. My site is not a static one - articles are added every day - and to edit all this every time we add a page of that format is unreal. Also, the css files, especially the override file, will become very large once 20, 40, 60 images are added.

There must be a better way... it is very disappointing to purchase a template and then have to hire someone to fix it immediately (which is what I'm about to have to do).

Z
User avatar
Junior Boarder

Konrad M
Mon Apr 08, 2013 9:10 am
Reply with quote
Report this post
Please give me url to page with this issue. And tell me it is K2 item page or standart joomla page ?
User avatar

GK User
Mon Apr 08, 2013 6:03 pm
Reply with quote
Report this post
Hi Konrad

The issue is that several css files need to be edited every time you add a new page that includes a large image at the top of the page. This is true for K2, standard Joomla pages and anything else.

Z
User avatar
Junior Boarder

Konrad M
Tue Apr 09, 2013 6:24 am
Reply with quote
Report this post
@zelena without url I can't help you.
User avatar

GK User
Tue Apr 09, 2013 4:30 pm
Reply with quote
Report this post
Konrad,

You are misunderstanding. I am not having trouble with a single page. I am having trouble with how this template is set up. The issue applies to any URL - try http://demo.gavick.com/joomla25/simplic ... e-elements for example.

I want to include a different LARGE image at the top of many of my site pages. Just like the homepage of the simplicity demo site.

Every time I need to do this - according to instructions in this forum - I need to edit several css files.
(1.) Include a new css class in the "override.css" file, identifying the source of my image and a couple of other elements, and
(2.) edit classes in ALL css files where the imageBg class appears, adding my new class.

A brief scan of the css files indicates that imageBg appears in 11 css files.

So, to add a new page with a large background image, I need to manually edit all of these files?

Simply, I am unable to use this template on a site with dynamic content. I cannot request that my non-techical staff manually edit and upload several .css files every time they want to place a large image at the top of the page. And there is no way to achieve this from the Joomla back end. IMHO, it's very poorly thought out. For us, it is an expensive, unusable investment.

Z
User avatar
Junior Boarder

Konrad M
Thu Apr 11, 2013 9:39 am
Reply with quote
Report this post
Zelena,
there is some partialy solution for you. As you see on our home page we add some suffix for page. So please remove our suffix from there and then edit all css files where you found ".imageBg" and remove it. For example
Code: Select all
.imageBg #gkHeaderMod .gk-form {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.23);
    border-radius: 3px 3px 3px 3px;
    display: inline-block;
    margin: 50px 0 65px;
    padding: 10px 10px 7px;
}

change to:
Code: Select all
#gkHeaderMod .gk-form {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.23);
    border-radius: 3px 3px 3px 3px;
    display: inline-block;
    margin: 50px 0 65px;
    padding: 10px 10px 7px;
}

This change allow you to have same format for elements inside header on every page.
So only one thing to do manualy would be adding suffix for page only to set diffrent bacground image. And you will need to edit only override.css file.
I hope it will be usefull for you.
User avatar

GK User
Wed Apr 17, 2013 2:39 pm
Reply with quote
Report this post
Thanks Konrad - that helps a lot.
User avatar
Junior Boarder


cron