Joomla Templates Club 406,261 posts

[ron685 Friend ron685Join date: March 2007Posts: 4Downloads:2Uploads:0]

#174764

I am using JA_Rave 1.0.1 template and joomla version 2.5.1

I wanted to change module background to blue (module name Actualites) followed the instruction to load suffix class; on the frontpage it shows blue is being loaded but the module background is not blue.

/** suffixes set ****/

#ja-wrapper .moduletableblue{background:#003366;color:#fff;}

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#442618

Ron:

Are you certain you are utilizing the correct module class suffix for the element/result you are wanting to configure?

[ron685 Friend ron685Join date: March 2007Posts: 4Downloads:2Uploads:0]

#442655

Thanks for the reply Tom.

I am using the suffix blue … taken from

/** suffixes set ****/

#ja-wrapper .moduletableblue{background:#003366;color:#fff;}

in template.css

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#442664

I’m not altogether certain if you are entering the correct information.

In addition to the official Joomla Wiki info concerning Class Suffixes, I recently wrote a brief tutorial on how to identify the proper module class suffixes for the respective templates –> SEE HERE

[ron685 Friend ron685Join date: March 2007Posts: 4Downloads:2Uploads:0]

#442791

I followed the instructions on both the wiki and the tutorial I still cannot get to show the blue background. When I right-click for the inspect element I see: <div class=”ja-moduletable moduletable blue clearfix” id=”Mod28″>

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#442805

<em>@ron685 306341 wrote:</em><blockquote>I followed the instructions on both the wiki and the tutorial I still cannot get to show the blue background. When I right-click for the inspect element I see: <div class=”ja-moduletable moduletable blue clearfix” id=”Mod28″></blockquote>
When you were following the steps in the tutorial, did you remember to set “Optimize CSS” to “No” within your Template Manager–General Settings (within your site administration)?

[ron685 Friend ron685Join date: March 2007Posts: 4Downloads:2Uploads:0]

#442812

Yes i did set “Optimize CSS” to no.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#442961

Try this . . . . .

Within file path –> /plugins/system/jat3/jat3/base-themes/default/css/layout.css

at line 34, you should see the following:

<blockquote>.column div.ja-moduletable, .column div.moduletable, .column div.ja-module, .column div.module {
margin-left: 15px;
margin-right: 15px;
}
</blockquote>

add a background color property to this rule – for example . . .

<blockquote>.column div.ja-moduletable, .column div.moduletable, .column div.ja-module, .column div.module {
background: none repeat scroll 0 0 #333
margin-left: 15px;
margin-right: 15px;
}
</blockquote>

This is just an example for example’s purpose, mind you . . . you will need to fiddle around with some additional settings to get the display as you like.

Incidentally, the same thing can be achieved by adding a similar background property to the following within your template.css file – within path –> /templates/ron/css/template.css

at line 81 . . .

<blockquote>div.ja-moduletable, div.moduletable {
background: none repeat scroll 0 0 #333333;
margin-bottom: 10px;
margin-top: 0;
padding: 0 0 20px;
position: relative;
}
</blockquote>

Let me know if this works for you.

[Author]

Posts