CSS codes for Phoenix
Posted by James Reiche on 10 April 2018 01:28 PM
CSS codes for Phoenix
CSS code can be used to make certain modifications to a Phoenix website.
If you want to make a global CSS modification that will affect every page on your Phoenix website then you would enter the CSS code in the CSS Code box found inside the sitezadmin Code includes section.
Here are some examples of different CSS codes that can be used with Phoenix and a description of what they do.
Remove default page title
This CSS code will remove the default page title from a text page.
Change page title color
This CSS code will manually change the color of a page title.
Change page title font
This CSS code will manually change the font of a default page title
You can add both codes if you want to change a page titles color and font.
There are settings inside the sitezadmin that will allow you to change the color and font.
CSS code should only be used if you want to override those settings and manually change something on a specific page.
Changing the font for specific text on page
Any text that is manually entered on a text page will match whatever font is selected for the General Text Font setting found inside the sitezadmin edit general settings section.
There are times when you might want to change the font on just some of the text on a page. ( like subtitles )
The Title font ( TESTING ) on the page below is set to Handlee and the general text font is set to display as Arsenal.
See how the subtitles EMAIL and PHONE display the same as the general text font.
Let's change the font on just those subtitles so they match the Title font.
Highlight one of the subtitles on the text panel inside the sitezadmin and click on the format tab then formats - headers - h2
Then do the same for the other subtitle that you want to change the font on and save the change.
Then go to the text pages ADVANCED SETTINGS tab and enter this CSS code there and save the change.
The text that was highlighted and marked as h2 will now appear in the font that is entered in the CSS code ( Handlee )
Lower a Gallery Title
By default, the gallery title displays on top of the main gallery image that appears on top of the gallery thumbnail page.
You can lower the gallery title to make it appear under the main gallery image instead using this CSS code
Remove a Gallery Title
This CSS code can be used to remove a gallery title.