QueHow

A How-To and wiki Blog

  • Operating System
    • Windows
      • Windows 10
      • Windows 7
    • Linux
  • Software
    • Application Software
    • Microsoft Office
      • Outlook
      • Word
      • PowerPoint
  • Internet
    • Browsers
      • Mozilla Firefox
      • Google Chrome
    • CMS
    • Tips & Tricks
  • Website
    • ecommerce
    • Google
    • Social Networking
    • General Websites
  • Mobile
  • Email
    • Gmail
  • Wiki

How to Edit Template CSS in Joomla 3.x

By Neha T Leave a Comment

The CSS is an acronym for Cascading Style Sheets. It represents the way in which the HTML content will appear. The motive behind creating the css is to treat the document data and its presentation separately, such that, the flexibility and the accessibility increases.

Creating a separate css file, would help in sharing the similar formatting in various html pages, that may result in the reduced complexity and the redundancy.

There are basically three types of css :

  • Inline: The inline style can be used for the individual css which will not be used repeatedly in your webpage as it is applied to the specific tag, explicitly.
  • Internal: This style sheet can be implemented to design a whole webpage by including it in the header file.
  • External: This style sheet is basically a file with an extension “.css” which is linked to the html pages and a single change in that file would reflect the same change in all the pages or in the website associated with it. This style sheet results in the reduced time, less complexity and the less occupied space.

Sometimes you need to edit the css embedded in your template to change the appearance of your website. This tutorial will guide you how to edit template css in Joomla 3.x by following the simple steps as explained below.

Steps to Edit Template CSS in Joomla 3.x

Step 1: Once you are logged in as an Administrator, On the dashboard, click on “Extensions” option and then select “Template Manager” from the drop down list.

how to edit template css in joomla-step1

Step 2: Click on the “Template” that you want to edit, under the “Template section” as shown in the figure.

Keep in mind, not to click on the template name under the style section, if you do so, then you”ll not be able to edit the template files instead, you will be only able to edit the style, such as heading, layout settings, etc.

how to edit template css in joomla-step2

Step 3: Now go to the css folder, once you click on that, many css files will be displayed, select the one you want to modify.

how to edit template css in joomla-step3
Step 4: I have clicked on “print.css”, you will find the code associated with the file , at the right side of it. Here you can see that,“text align” is set to “center” as highlighted in the figure shown below.

You can change the text alignment, margin, background and other attributes according to their availability in your template.

how to edit template css in joomla-step4

Step 5: As, I described above, you can change any of the attributes, I have changed the text alignment to “justify” from “center” as shown below.

Once you are done with the changes, click on “Save &  Close” button.

how to edit template css in joomla-step5

Step 6: Once the changes have been made,  you”ll see the message “File successfully saved”.

how to edit template css in joomla-step6

You Might Also Like:

How to Edit a Template in Joomla 3.x How to Edit the Copyright Footer in Joomla in 3.x How to Install a New Template in Joomla 3.x How to edit Signature in Outlook 2010 How to View Module Positions in Joomla 3.x How to Position a Module in Joomla 3.x How to Change a File Extension in Windows 7 How to create a zip file using terminal in Ubuntu 14.04

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Most Viewed

  • How to Install and Use TELNET in Ubuntu
  • How to install Hindi fonts in MS Word
  • How to Change a File Extension in Windows 10?
  • How to create a flipkart account in 3 simple steps
  • How to Change Monitor Refresh Rate in Windows 10?
  • How to install IIS on Windows 10
  • How to Insert Clickable Checkbox in MS Word 2016?
  • How to Set Auto Reply in Outlook 2016?
  • How to Login as Administrator in Windows 10?
  • How to Check RAM Size and System Type in Windows 10?

Recent Additions

  • How to Add Hyperlink to Another Sheet in Excel?
  • How to Add and Remove Watermark in Excel
  • How to use Relative and Absolute Cell Reference in Excel?
  • How to Enable and Disable Scroll Lock in Excel?
  • How to Use INDEX and MATCH Functions in Excel?
  • How to Make Bar Graph in Excel?
  • How to Count Duplicate Values in Excel?
  • How to Wrap Text in Excel?
  • How to Round off Numbers in Excel?
  • How to Create a Bell Curve in Excel?

Related Searches

  • How to Crop and Zoom Video in Power Director?
  • How to Remove RSS Feeds from outlook 2010
  • How to Disable Right Click on Images in Wordpress through Code / Plugin
  • How to Insert a YouTube Video in MS PowerPoint 2016?
  • How to convert notepad to PDF

Copyright © 2023 · QueHow · Contact Us