Joomla article background CSS
Question
I want a background (color) to be displayed by default for each article. I thougt of doing this in a css file, but I don't know where to place the statement. Btw I can't find the definition of the article tag in any css file.
The following code shows 2 articles:
<div class="items-row cols-3 row-0 row">
<div class="item column-1 col-md-4">
<!-- Article -->
<article>
<header class="article-header clearfix">
<h2 class="article-title" itemprop="name">
<a
href="/joomlatest/index.php/78-uncategorised/welcome"
itemprop="url" title="Welcome">
Welcome</a>
</h2>
</header>
<!-- Aside -->
<!-- //Aside -->
<section class="article-intro clearfix">
<p>Hi</p>
</section>
<!-- footer -->
<!-- //footer -->
</article>
<!-- //Article -->
</div>
<div class="item column-2 col-md-4">
<!-- Article -->
<article>
<header class="article-header clearfix">
<h2 class="article-title" itemprop="name">
<a
href="/joomlatest/index.php/dates/testdate"
itemprop="url"
title="Testdate">
Testdate</a>
</h2>
</header>
<!-- Aside -->
<!-- //Aside -->
<section class="article-intro clearfix">
<p>some Text</p>
<p>
<img src="/joomlatest/images/9697505.jpg" alt="9697505" />
</p>
</section>
<!-- footer -->
<!-- //footer -->
</article>
<!-- //Article -->
</div>
</div>
Any ideas which stylesheet or which tag I should manipulate or is there any other way this is done?
2 answers
solution1
1 2015-02-09 04:18:54
Where to put the CSS depends on the website. If you're a developer you can add CSS files to extensions etc; if a user, the template you are using is the most likely place to put your CSS and that will depend on the particular template you are using. Some templates have overrides you can select in the administrator, for others you will need to find the template (in /templates/yourtemplate) and pick which CSS file to edit; typically that will be in a folder called css, and the main css file is likely called template.css. Some commercial templates have custom css files so you can avoid having your custom css overwritten if you update the template.
For how to apply the background color, that will depend on your joomla version as well as the specific way the article is displayed. In you instance, applying to div.item probably will work, but items might also be displayed in class item-page, or a template might override the stock joomla layout for one of the various article display options. Thus you'll probably want to inspect the pages and find out what classes are used, and make sure to check various different pages to see if the different ways items get displayed (such as Category - blog, single article, featured articles, or any particular modules or components you use to display content in other ways.
solution2
1 ACCPTED 2015-02-09 10:15:21
I just found a solution, where I don't have to change the template's css files (thanks to Charlie for the update thought ). The template I'm using ( Purity III T3 template ) has a menu caled "Custom Code" on the backend. Here I added code at the field After <head> .
<style>
article {
background-color: rgba(255,255,255,0.4);
border-style: solid;
border-color: rgba(51,153,51,0.5);
border-width: 20px;
padding: 20px
}
</style>
Probably not the best solution, but it works for me.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.