Joomla Templates Club 406,261 posts

[newtybar Friend newtybarJoin date: December 2010Posts: 30Downloads:0Uploads:1 Thanks: 7 Thanked: 1 times in 1 posts]

#160827

Hi All,

Thanks to all of your help my site is coming along nicely (I’m also learning a lot!) and is almost done.

Here’s another question (probably the last before it goes live).

On certain module positions I would not like to include the styling that goes with it (for example the background image and border). I would just like it to be transparent around the image I put into it. Somehow I accidentally did this with “The Blog” image on the right hand side of the page, but I can’t duplicate it for the positions “ja_sl1” or “ja_news.” No matter what I do, the border and background image always shows up. Is there any way to exclude these?

Thanks!

site: http://www.rummageclothing.com

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#378909

You can apply a module suffix and create a new CSS, for example
.myclass
{
background:none!important;
border:none!important;
}

You can read more about module suffixed in Joomla Docs here and here.

1 user says Thank You to gray for this useful post

1. newtybar

[newtybar Friend newtybarJoin date: December 2010Posts: 30Downloads:0Uploads:1 Thanks: 7 Thanked: 1 times in 1 posts]

#378917

<em>@gray 224454 wrote:</em><blockquote>You can apply a module suffix and create a new CSS, for example
.myclass
{
background:none!important;
border:none!important;
}

You can read more about module suffixed in Joomla Docs here and here.</blockquote>

Gray – thanks that was very helpful knowledge. It works on most module positions, however for some reason does not work in the ja-news and ja-topsl positions (which are the positions I would like to be transparent).

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#378940

JA News has its own CSS file – you can adjust the background right there.
As regards “ja-topsl” position – please give me an indication what element and on what page is located there I to check it.

PS. Opera and Chrome provides “Inspect Element” development tool with which you can easily find styles applied. FF needs FireBug to be installed, but it’s also a great tool for developers.

[dunglq Friend dunglqJoin date: March 2010Posts: 108Downloads:0Uploads:0 Thanks: 6 Thanked: 12 times in 13 posts]

#379018

<em>@newtybar 224463 wrote:</em><blockquote>Gray – thanks that was very helpful knowledge. It works on most module positions, however for some reason does not work in the ja-news and ja-topsl positions (which are the positions I would like to be transparent).</blockquote>

Hi,

to do with ja-topsl please go to file templates/ja_rummagephase1/css/colors/handwritten_light.css

Change at line 314 to :


#ja-topsl div.ja-innerpad {
background: none repeat scroll 0 0 transparent;
border: 0;
}


[newtybar Friend newtybarJoin date: December 2010Posts: 30Downloads:0Uploads:1 Thanks: 7 Thanked: 1 times in 1 posts]

#379522

Dung – I believe that works, thanks.

However, I have another position that is called “ja-topsl2” that I added in which references div id: ja-topsl1. I think this will make them both transparent. I would prefer to make topsl2 not transparent and only topsl1, how would I do this?

[dunglq Friend dunglqJoin date: March 2010Posts: 108Downloads:0Uploads:0 Thanks: 6 Thanked: 12 times in 13 posts]

#379587

Hi,

You can using module custom suffix(core joomla featured) to add special style for module you want.

[Author]

Posts