test

How can I add styles to modules?

Forums    Joomla Templates Club    How can I add styles to modules?
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • ktbgreat2 Friend
    May 22, 2013 at 8:16 am #187705

    Hi there,

    Im looking to style my modules, so that they stand out as apart from the white background. Id also like them to have curved edges and maybe a coloured header.

    Im using Ja Tiris. I have seen tutorials that use the template Beez_20 and they say go to layout.css inside the css folder. The problem so far for me is that Ja Tiris does not seem to have a layout.css file.

    I have also found this css Generator which I was gonna use to get my code… Will this work with Ja Tiris?

    Thanks for any help I can get 🙂

    Katie
    P.s my site is http://www.tennisworks.com.au

    Ninja Lead Moderator
    May 23, 2013 at 8:00 am #493719

    If it is css Generator you can use within JA Tiris template

    In order to styles for specific module, you can use class suffix in advanced option of that module, just enter a class name then add style for it.

    1. module_class_suffix

    1 user says Thank You to Ninja Lead for this useful post

    1. ktbgreat2
    ktbgreat2 Friend
    May 24, 2013 at 7:31 am #493823

    Thanks heaps for getting back to me!

    Its seems like it might be easier than I thought! Just thinking through all the steps now though… So you think that css generator code will work, where should I add the code though? Which css file?

    Also could you give me an example of how I add a class name, and where?

    Thanks

    Ninja Lead Moderator
    May 25, 2013 at 3:30 am #493901

    Right now its difficult to suggest solution to you because i am bit confused about your request.

    But you can add css file into head page

    1) Upload css file into your hosting (or external css from other site)

    2) Add css file into head page
    <blockquote><link rel=”stylesheet” href=”path_css_file” type=”text/css” /></blockquote>

    With Tiris template you can add this way

    Open templates/ja_tiris/etc/layouts/default.xml file
    from

    <stylesheets>
    </stylesheets>
    change to

    <stylesheets>
    <file>path_css_file</file>
    </stylesheets>

    3) Add css style into module class suffix

    Remember to clear cache from Admin area after changing

    ktbgreat2 Friend
    May 26, 2013 at 11:37 am #493981

    Thanks so much for trying to help me, even though Im a bit new and dimwitted when it comes to some of these things.

    I think your your explanation is on the right track, but Im just a little confused about somethings.

    I guess Im confused mostly when you say ” Add css file into head page”

    What is the head page :p Sorry

    I have gotten the code off of that css generator site, and put it in TextEdit. So I can save that as a css file? Then upload it in my server. Should I name it something specific? eg path_css_file

    Also I am confused about the code <link rel=”stylesheet” href=”path_css_file” type=”text/css” />
    Where should I add it? You said the head page, but I really dont know what that is :p

    I have changed the templates/ja_tiris/etc/layouts/default.xml file though. Thanks for that help

    Sorry again for my ignorance. Im learning, but I think were almost there!

    Cheers
    Katie

    Ninja Lead Moderator
    May 27, 2013 at 4:55 am #494031

    Hi Katie,

    You can have a look at guideline about JAT3 Framework for reference: http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides

    I mean the head block, you can add css between <head>..</head> tags, see the screenshot

    Regards

    1. head_tiris
    ktbgreat2 Friend
    May 28, 2013 at 4:22 am #494141

    Hi again 🙂

    Thanks for that screencap 🙂 Where is that code from though? I get now, the “Head Page” reference, but Im just unsure as to where to find that code.

    Thanks and sorry again for being new to this.

    Cheers
    Katie

    Ninja Lead Moderator
    May 28, 2013 at 10:09 am #494177

    Please take a look at my previous reply again 🙂 http://www.joomlart.com/forums/topic/how-can-i-add-styles-to-modules/#post-493901

    ktbgreat2 Friend
    May 29, 2013 at 10:22 am #494295

    Thanks but I dont understand that bit;

    You said to add css file into head page

    <link rel="stylesheet" href="path_css_file" type="text/css" />

    I dont know what the code above is. Is that where you got that screenshot?

    I dont see any <head> in templates/ja_tiris/etc/layouts/default.xml file, so you must have meant the code above. I just dont know where to find that.

    Please talk to me like a total beginner. I know some things, but some things I have no idea yet. Sorry 🙂

    ktbgreat2 Friend
    May 29, 2013 at 12:35 pm #494304

    Oh I think I realize the confusion. I dont use Dream Weaver or anything. I just edit my files through the host FTP, and I dont know where to access the HTML of my site. Is that where that code above would be?

    Sorry, trying to understand and learn.

    Ninja Lead Moderator
    June 3, 2013 at 4:35 am #494511

    There are two ways to add css file link into <head> tags

    1) Open templates/ja_tiris/etc/layouts/default.xml file
    from

    <stylesheets>
    </stylesheets>
    change to

    <stylesheets>
    <file>path_css_file</file>
    </stylesheets>

    2) Copy plugins/system/jat3/jat3/base-themes/default/blocks/head.php file and paste to templates/ja_tiris/blocks/

    Open head.php file in template and add new css file end of file

    <link rel="stylesheet" href="path_css_file" type="text/css" />

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)

This topic contains 11 replies, has 2 voices, and was last updated by  Ninja Lead 11 years, 6 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories