Joomla Templates Club 406,261 posts

[bollog Friend bollogJoin date: March 2011Posts: 43Downloads:0Uploads:14 Thanks: 5]

#162508

Hi,

How can i create a new module class (e.g. suffix: ‘_icon1’)? I tried to copy and paste the lines at the pluginscontentja_tabsthemesportfoliostyle.css file like

.portfolio ul.ja-tabs-title li.ja-tab-title_icon1 h3 { background-image: url(icon1.png); }
.portfolio ul.ja-tabs-title li.ja-tab-title_icon2 h3 { background-image: url(icon2.png); }
.portfolio ul.ja-tabs-title li.ja-tab-title_icon3 h3 { background-image: url(icon3.png); }
.portfolio ul.ja-tabs-title li.ja-tab-title_icon4 h3 { background-image: url(icon4.png); }
.portfolio ul.ja-tabs-title li.ja-tab-title_icon5 h3 { background-image: url(icon5.png); }
.portfolio ul.ja-tabs-title li.ja-tab-title_test1 h3 { background-image: url(test1.png); }


but did not work. What am i missing here?

Thanks!

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385368

Sorry but the above reference wont work

Please let me know the position you have assigned presently for specific module and what do you wish to achieve mainly with this suffix

[bollog Friend bollogJoin date: March 2011Posts: 43Downloads:0Uploads:14 Thanks: 5]

#385389

Hi aman204 and thanks for your reply,

My target is to manage presentation of content (articles) by using jatabs modules. One content cosists of multiple articles furthermore multiple tab blocks within a tab panel. I have noticed though that i cannot set icon next to the title of each tab within tabber when article id’s are assigned to the tab module parameters, so i decided to create multiple ‘mod_cutom’ modules referring to my articles and set position to ‘tabs’ (like your JA Portfolio quckstart first example does). This way i have the ability to assign module class for each custom module and so i can set an image next to the title separately for each article of a content. How do i create a module class (like ‘_icon1’ does for example) in order to achieve this configuration?

Regards,

George

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385404

<blockquote>This way i have the ability to assign module class for each custom module and so i can set an image next to the title separately for each article of a content.</blockquote>

But You wont be able to assign icon to tab titles through this way as title styling is carried through tab module itself

[bollog Friend bollogJoin date: March 2011Posts: 43Downloads:0Uploads:14 Thanks: 5]

#385416

Any suggestions then please? I would like to be able to assign my own icons to the tab titles.

Regards,

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#385474

<em>@bollog 232986 wrote:</em><blockquote>Any suggestions then please? I would like to be able to assign my own icons to the tab titles.

Regards,</blockquote>

Seems that this would require custom coding to have this feature

Other way, If you wish to add a icon which would remain similar for all tabs, You can change this::

.portfolio .ja-tabs-title-top ul.ja-tabs-title li {style.css (line 42)
background:#CACCCD;
border-bottom: 1px solid #B5B5B7;
border-left: 1px solid #E2E2E5;
border-right: 1px solid #B5B5B7;
height: 60px;
margin-bottom: -1px;
margin-left: 0;
width: 140px;
}

to

.portfolio .ja-tabs-title-top ul.ja-tabs-title li {style.css (line 42)
background:#CACCCD url(../images/sample.png) no-repeat;
border-bottom: 1px solid #B5B5B7;
border-left: 1px solid #E2E2E5;
border-right: 1px solid #B5B5B7;
height: 60px;
margin-bottom: -1px;
margin-left: 0;
width: 140px;
}

and update image path accordingly with image which has been uploaded

[bollog Friend bollogJoin date: March 2011Posts: 43Downloads:0Uploads:14 Thanks: 5]

#386862

That works for me. Thanks 🙂

[Author]

Posts