Your cart is empty

Tips for Cassiopeia (J4)

Current Quickstarts

joomla 4 quickstart packages
Various extensions can be selected!

Basics

Many settings in the Cassiopeia template are made directly in the template style. It is possible to create several template styles for one template. Thus, for example, a different style can be selected for each menu item.
 

Create multiple template styles

To create a new template style, proceed as follows:

  • Go to System -> "Templates: Site Template Stile" in the backend!
  • Select the template style to be copied and click on the button "Duplicate"!
  • The template style has now been duplicated. If you want to change its name, open the style, enter a new name and save the style!


Important: With every update of Joomla, the template files could also be overwritten by the Cassiopeia. It is therefore advisable to work with a copy of the Cassiopeia template. You can find out how to create a template copy at the bottom of this page. Please do not confuse the template copy with the copy of a template style!
 

Style editing view

Cassiopeia style editing

Adding a logo

Here you can define your own logo from the Joomla image directory for your website. This can also be uploaded from your computer. Joomla will automatically display the logo in the designated logo position (link at the top of the website). A link to the homepage is automatically generated for the logo.

Titel (alternative to logo)

If you are not using a logo, you can enter a title (alternative text) here, which will be displayed in place of the logo. If neither a logo nor a title is given, Cassiopeia automatically uses the following image file from the core, which simply shows the text "Cassiopeia": /templates/cassiopeia/images/logo.svg

The order of priority is consequently: Own logo -> titel -> Standard logo (with text "Cassiopeia")

A link to the homepage is automatically generated for the logo, title and SVG file.

Tagline

Enter a description for the website here! Cassiopeia places this under its own logo or the title or the standard logo.

Fonts scheme

You have several options for defining the fonts on your website: Due to the complexity, an explanation will be given later.

Colour Theme

The Cassiopeia template contains the color schemes "Standard" and "Alternative".
Standard: In this scheme, the colors are already optimized so that everything is barrier-free
Alternative: With this scheme, the preset colors can be overwritten. The changes are entered in the user.css. You can find out how to create a user.css further down on this page.

Tip: Further color schemes can be created for the template color.

Choosing between a static or fluid layout

The two responsive layouts "Static" and "Fluid" determine how your website is displayed in the frontend. The static layout shows the website content within a container in the front end. With the fluid layout, the container is removed and the website extends over the entire width of the browser. When reducing the size of the viewing window, the content and the side columns decrease as a percentage.

Set Sticky Header

If you activate the "Sticky Header", the header area (logo, menu ...) of the website always remains visible at the top of the screen when you scroll down the page. As soon as you deactivate the "Sticky header", the header area of the website scrolls with it.

Set "Back to top" - Link

You can insert a link (arrow icon) at the bottom right of the page. If this is clicked, the page automatically scrolls to the top.

 

Create a custom css file (user.css)

Important: With the Cassiopeia template, the user-defined file is called user.css and not custom.css, as is the case with many other templates!

Changes to the css files could in principle be made directly in the Cassiopeia css files. However, if these files are overwritten during a Joomla update, the changes would have to be carried out again. To avoid this, there is a more sensible alternative. A user.css is created in which all changes are written. This user.css will not be overwritten during a Joomla update.
To create the user.css, proceed as follows:

  • Go to System -> "Templates: Site Templates" in the backend!
  • Open Cassiopeia (or a copy of Cassiopeia) by clicking on "Cassiopeia - Details and Files"!
  • Click the "New File" Button"!
  • Select the directory "css" in the opened modal window!
  • Enter user in the "File name field"!
  • Choose the file type css below!
  • Click the "Create" Button!

Joomla has now created the following css file: templates/cassiopeia/css/user.css

Every time a page is called, Joomla checks whether there is a user.css and then calls it up as the last css file. Only the css changes are written to user.css. Under no circumstances should the entire content of template.css be copied into user.css!
An editor such as Notepad ++, PSPad or similar can be used for editing. Editing in the backend (template manager) is also possible.
 

Changes are not displayed in the frontend

Did you make changes to your website, but your browser is still showing the old version? Then this is very likely due to the cache problem.
So that web pages can be displayed faster, they are usually cached. The cache of the server, the Joomla cache and the cache of the browser used or all of them can be used simultaneously. When a page is displayed, the cache is checked first and, if this page is available, it is then loaded directly from the cache. The changes are not yet included on this page.
If you change a website and the change is not displayed, you have to ensure that the caches are emptied so that the new page is loaded into the caches.

It is usually sufficient to empty the browser cache and the Joomla cache:

1. Clear Joomla cache: Go to System -> "Maintenance: Cache leeren" in the backend and empty the Joomla cache! Alternatively, you can also call up "Empty cache" via the "Dashboard"!

2. Clear Browser cache: How you empty the browser cache depends on the browser and device used (computer, tablet, smartphone ...). Usually you can find the cache options a bit hidden under the settings!

3. OPCache, APC, XCache or similr: Since these caches only affect the execution of PHP scripts, manual emptying is in principle not necessary, which is why it will not be discussed in more detail at this point.

Tip: When designing a website or when making major changes, it is advisable to deactivate the caches in order to save yourself the permanent emptying!
 

Work with copy of Cassiopeia (template copy)

With every update of Joomla, the template files could also be overwritten by the Cassiopeia. It is therefore advisable to work with a copy of the Cassiopeia template right from the start.

Important: Please note that this is a template copy and not a copy of a style within a template.

To make a copy of the template, proceed as follows:

  • Go to System -> "Templates: Site Templates" in the backend!
  • Select the template to be copied and click on the "Copy Template" button!
  • Enter a name for the template copy and click on the "Copy Template" button!
  • After the new template has been created, click the "Close" button!

The new template is now displayed in the template list. You can use it just like the original template. However, it will not be overwritten during a Joomla update.

Tip: You cannot delete a template in the template manager! However, a template can be deactivated or uninstalled. Go to System -> "Manage: Extensions", mark the template there and carry out the desired action!

Notes

All prices quoted in Euro include the statutory German VAT of currently 19%. The final price can change after entering the billing information, for example if the order is placed as a company. The prices refer to the creation of the Quickstart packages.
More

Joominator.de gehört nicht zu The Joomla! Project ™ und wird auch nicht durch dieses unterstützt. Die Verwendung des Joomla!® -Namens, -Symbols, -Logos und der zugehörigen Marken ist im Rahmen einer von Open Source Matters, Inc. gewährten beschränkten Lizenz gestattet.
Joominator.de is not affiliated with or endorsed by The Joomla! Project™. Use of the Joomla!® name, symbol, logo and related trademarks is permitted under a limited license granted by Open Source Matters, Inc.

Joomla Logo