Theme Customizer Options

The Paloma theme comes with a full featured theme customizer that allows you to take control of the look of your site and see your changes in real time before committing them to your live site. This section will cover the various settings included in the customizer.

To access the customizer, go to Appearance > Customize.

SITE IDENTITY

Site Title – The main title on the home page.

Tagline – The subheader on the home page.

Logo Upload – You can optionally add a logo to your site here. You can select to have the site tagline displayed as well.

Logo Size – Adjust the size of your logo.

Site Icon – Upload a custom site icon (or Favicon) for your site’s browser and app icon.

HEADER MEDIA

Header Video - Upload a video to your home page header area

Header Image - Upload an image for your header area, this is also used on mobile devices

Header Display Style - Select how you want to display the header on the home page

Landing Header Overlay Color - Color to overlay your header video and image

Overlay Opacity - Change the brightness of the overlay color

Header Overlay Text - Text to display in your header area

"Scroll to Content" Text - Text to scroll down to content area below header

LAYOUT SETTINGS

Single Pages – These settings apply to static pages only.

Blog Pages – These settings apply to the main blog only.

Post Archives – These settings apply to post archives only.

Blog Posts – These settings apply to individual blog posts only.

WooCommerce – Layout options for WooCommerce (note: only available if WooCommerce is installed)

Sidebar – Enable / disable sidebar stickiness.

Portfolio Pages - Layout settings that apply to portfolio pages

COLORS

Header Text Color - Affects header text color

Header Text Color (When header image/video active) - Affects header text color when the header image or video is active.

Primary Background Color – Affects all header and primary background color.

Secondary Background Color – Affects secondary colors, like categories and contact button.

Footer Background Color – Affects the footer area background color.

Prefooter Background Color - Affects the prefooter area background color.

Button Accent Color – Affects button accent color.

Button Hover Color - Affects color of button when hovering/clicking on it.

Divider Line Color – Affect divider lines color.

TYPOGRAPHY

This section allows you to edit the typography styles across the website theme and includes support for Google fonts. Here’s a standalone page on our site about working with Google Fonts in Paloma.

Google Font Link Code – In order to use Google Fonts, they must be installed on the website. It’s recommended that you install all weights of a font in order to maintain consistency throughout the site. Here are the steps to find the Google Font Link Code:

  • Go to Google Fonts and browse the fonts and styles you’d like to use

  • Click + Select This Font for each style you want to use

  • Once you’ve selected your fonts, in the bottom right of the screen click on the black collapsed window

  • Go to Embed This Font – click on Standard and copy this link

  • Paste this link somewhere like a text editor for safe keeping

  • Copy only the section within the quotes starting with ‘http://…’ (e.g., http://fonts.googleapis.com/css?family=Lora:400,700)

  • Go back to the WordPress customizer and paste that code in the Google Font Link Code field

  • You can now enter the font family name into either the fields for Primary Header Font Family, Secondary Header Font Family, Body Text Font Family or use it in your CSS.

Here’s a handy screenshot for an accompanying visual. For example, if you were using the fonts Old Standard TT and Rubik, here’s how you would find the link:

GoogleFonts-2.png

Primary Header Font Family – Enter the name of the font family to use for headings. Accepts system fonts (Helvetica, Arial, etc.) and Google Fonts if included in the Google Font Link Code field.

Primary Header Font Size – Slide the slider to edit the size of your primary header text.

Secondary Header Font Family – Enter the name of the font family to use for headings and input fields. Accepts system fonts (Helvetica, Arial, etc.) and Google Fonts if included in the Google Font Link Code field.

Secondary Header Font Size – Slide the slider to edit the size of your primary header text.

Body Text Font Family – Enter the name of the font family to use for body text and input fields. Accepts system fonts (Helvetica, Arial, etc.) and Google Fonts if included in the Google Font Link Code field.

Body Font Size – Slide the slider to edit the size of your primary header text.

Text Color – Set the color for main content.

Footer Text Color – Set the color for footer text.

Link Text Color – Set color for linked text.

SOCIAL MEDIA ICONS

Standard Icons & Settings – Edit the social media icons here. Fields left blank will not display. Make sure to include the “http://” for links to be valid.

Custom Icons – Enter the name of the Font Awesome icon to be displayed (e.g., youtube); all icons can be viewed here.

SLIDER SETTINGS

Blog Slider Settings – These settings apply to the slider on the main blog page only.

Global Slider Settings – These settings will affect the slider on the blog page, as well as any sliders on the Landing Page template.

CALL TO ACTION BOXES

Here you can edit the image, text, links, and number of promoted boxes on the blog layout.

ACCENT IMAGE

These settings apply to the accent image (the squiggly line underneath Page Builder section titles and "Read More")

MENUS

Gear Icon – Open options for individual menu items, you can check the Link Target to set menu items to open in a new tab.

Menu Location – Switch menu locations between primary and footer options.

Footer Menu – Add/remove menu links and rearrange and create drop-down menus here for your footer menu.

Primary Menu – Add/remove menu links and rearrange and create drop-down menus here for your primary menu.

NAVIGATION STYLE

Customize the look of your navigation menus here and enable/disable sticky navigation. You can also enable/disable the “search” option and "cart" button in the upper navigation bar.

WIDGETS

Configure your Newsletter and Instagram footer widgets here. Widgets can also be configured under Appearance > Widgets.

STATIC FRONT PAGE

Your theme supports a static front page. Set your home page as static or as your latest posts.

ADDITIONAL CSS

Add any custom CSS code here. This allows you much more granular control over the style of the theme. This data will be saved during theme updates as well (yay!).

RELATED POSTS

Edit your related posts underneath individual blog posts. You must click on an individual blog post to view these settings. Here you can update your headline, thumbnails, date, context, and layout you want to be displayed for your related posts. Related Posts must be enabled under Jetpack > Settings for this option to display.

FOOTER

Customize the look of your prefooter, footer, copyright text, and “Back to Top” button here.

Prefooter Newsletter Section – Upload a background image for the newsletter section.

Traditional Footer – Choose the number of columns in your footer.

Footer Copyright Text – Enter in any text you would like to display in the footer copyright line. This will display your site title by default.

Custom Image Upload – Add a custom “Back to Top” image for your button. You can also enable/disable the button’s stickiness and disable the button here.

DEVELOPMENT

The Advanced Custom Fields Pro plugin is included free with this theme. Check this box to enable and access the configuration area in your WP dashboard.

PalomaStation Seven