LogoLogo
DLX PluginsQuotesDLXMediaRon LLC
Quotes-DLX
Quotes-DLX
  • Welcome to QuotesDLX
  • Getting Started
    • Installing the Plugin
    • Finding the Plugin Settings
    • Finding the QuotesDLX Block
    • Shortcode Parameters
    • Available Themes
  • QuotesDLX Block
    • Inserting the Block
    • Block Overview
    • Block Tabs
    • The Block Toolbar
      • Switching Themes
      • Preview Mode
      • Formatting Options
    • Sidebar Options
    • Adding Citations
  • Admin Settings
    • The Home Screen
    • Setting Block Defaults
    • Setting Contextual Menu Defaults
    • Setting a Default Theme
    • Theme Options
    • Setting a License
      • Opting into Betas
    • Advanced Options
    • Support and Docs
  • Themes
    • Themes Overview
    • Creating Your Own Theme Plugin
    • Creating Your Theme Stylesheet
  • Developers
    • 🍷Changelog
    • Actions
      • quotes_dlx_before_modal_scripts
      • quotes_dlx_after_modal_scripts
      • quotes_dlx_core_license_{action}
    • Filters
      • quotes_dlx_plugin_preview_modal_styles
      • quotes_dlx_plugin_preview_modal_scripts
      • quotes_dlx_block_attributes
      • quotes_dlx_block_output
      • quotes_dlx_block_template
      • quotes_dlx_block_wrapper_classes
      • quotes_dlx_block_wrapper_id
      • quotes_dlx_block_max_width
      • quotes_dlx_load_fonts
      • quotes_dlx_block_defaults
      • quotes_dlx_can_preload_fonts
      • quotes_dlx_fonts_to_preload
      • quotes_dlx_preload_font_urls
  • Support
    • Changelog
    • Code Access
    • Included Support
    • Paid Support
    • Feature Requests
    • Report a Bug
  • Quick Links
    • Get Support
    • Changelog
    • Buy QuotesDLX
    • Brand Assets
    • MediaRon Home
    • Contact Form
Powered by GitBook
On this page
  • Editing a Theme
  • Editing Theme Colors
  • Editing Font Sizes Per Breakpoint
  • Custom Fonts per Theme

Was this helpful?

  1. Admin Settings

Theme Options

Set theme colors, set font sizes, and enable custom fonts per theme.

PreviousSetting a Default ThemeNextSetting a License

Last updated 11 months ago

Was this helpful?

Editing a Theme

On the theme options page, you are presented with a dropdown selector where you can choose to edit a particular theme.

Saved Changes: If you choose to select a new theme, any unsaved changes will be lost.

Editing Theme Colors

Editing a theme is as straightforward as selecting some parts of the theme's colors to override. The preview will automatically update with the selected colors.

The default colors are shown, and you can customize the theme to match your site's colors. This allows you to use the design of the quote, but to your own tastes.

When you are done editing the colors, you can save or reset the options.

Editing Font Sizes Per Breakpoint

You can edit the font sizes for the mobile, tablet, and desktop breakpoints.

Custom Breakpoints: Unfortunately with the current state of CSS, it is difficult to have dynamic breakpoints. As a result, the breakpoints cannot be edited.

For each breakpoint (desktop, tablet, and mobile), you can modify:

  • The base font size (default is 16px for desktop).

  • The line height of the quote

  • The base button font size (default is 16px for desktop)

Base Fonts: a base font is what all child elements use. For example, with a base font size of 16px, a 1em font-size will also be 16px. If the base font size is increased, then 1em becomes even higher.

Custom Fonts per Theme

Finally, you can set custom fonts per theme. These will override any advanced options.

There's a convenient preview button so you can see what the fonts will look like in a modal.

Find a Theme to Edit from the Dropdown
Theme Selector
Editing a Theme's Colors
Save or Reset Theme Colors
Mobile Size Options
Tablet Size Options
Desktop Size Options
Selecting a Custom Font Per Theme
Setting a Custom Font
Font Preview in a popup Modal