search

phgDigital / Project

1 stars 1 forks source link

Customizer Options: Extended Customization Options #17

Open phgDigital opened 7 years ago

phgDigital commented 7 years ago

I feel like week could add a few more options here for customization.

  1. Primary & Secondary Button Colors
  2. Link Color
  3. Text Color
  4. Title Text Colors*
  5. Section Header Color
  6. Header Nav Text Color & Size
  7. Foote Nav Text Color & Size
chrisblakley commented 7 years ago
  1. We could utilize the .btn-brand class that modified a Bootstrap button to use the primary color.
  2. Link text is supposed to use the primary color... Might be broken.
  3. Text Color is already a Customizer option. Let's test it some more.
  4. Along with the logo color and stuff, I'm a little wary about doing this one... It might be necessary- we can discuss.
  5. Same as 4
  6. This is an interesting one I didn't think about with the overlay option. As much as I don't want to, we may need to add an option for this...
  7. Same as 6

Edit: Regarding font sizes, I want to keep them set for now.

For all of these, lets check out some other themes out there and see what they're doing with the Customizer to combat these problems.

phgDigital commented 7 years ago

Few more: Footer Widget Area Background Color Footer Widget Area Text Color Footer Text Color

chrisblakley commented 7 years ago

I installed a couple other themes to see how they use the Customizer and here are some more ideas.

They have sections nested within other sections. I love the idea of this to organize the options better. One has an entire section dedicated to Typography. One allows the layout to be controlled by the Customizer (sidebar left, right, or full-width).

This one also controls the dynamic content sections via the Customizer, too (instead of custom fields or widgets).

I think many of the settings interface that these are using are not WordPress core... which I don't think we should go down that rabbit hole. I'd like to find a way to keep all of our Customizer interface options to WP core.

chrisblakley commented 7 years ago

Another theme has a dropdown option for background positioning as well as a dropdown for preset "skins" (or schemes).

It also had a separate section for individual post features: screen shot 2017-07-19 at 10 09 14 pm

This one also had an option for completely different footer layouts... If we wanted to make multiple footers we could- we could keep them in a directory within /includes. This would be a way down the road thing, though.

chrisblakley commented 7 years ago

Ok, to nest sections we simply need to create Panels.

$wp_customize->add_panel('test_panel', array(
    'priority' => 10,
    'capability' => 'edit_theme_options',
    'theme_supports' => '',
    'title' => 'Test Panel Options',
    'description' => 'Several settings pertaining my theme',
));

$wp_customize->add_section('test_section', array(
    'title' => 'Test Section',
    'priority' => 50,
    'panel'  => 'test_panel',
));

$wp_customize->add_setting('test_setting', array('default' => null));
$wp_customize->add_control(new WP_Customize_Color_Control($wp_customize, 'test_setting', array(
    'label' => 'This is a test',
    'section' => 'test_section',
    'priority' => 10
)));

Maybe we should have a quick whiteboard meeting to organize all of these (and plan out new ones). I'd be more inclined to have more micro-settings now that we can really organize them well.

chrisblakley commented 7 years ago

Another thing I was thinking- instead of inlining each of the Customizer styles, we could hook into the wp_head at 200 and echo an embedded style tag with all Customizer style overrides.

We'd have to write it as raw CSS, but so far they haven't been more than one line each.

chrisblakley commented 7 years ago

Most link colors across the site should be fixed now.

chrisblakley commented 7 years ago

Some more thoughts on organization:

2017-07-20 16 13 45 2017-07-20 16 13 55

chrisblakley commented 7 years ago

Here's where we ended up after the workshop:

2017-07-21 12 31 53 2017-07-21 12 32 01 2017-07-21 12 32 08

chrisblakley commented 7 years ago

This checklist is for adding Customizer options.

See the checklist in the next comment down for actual implementation of those options.

Bold are panels Italic are core WordPress options

chrisblakley commented 7 years ago

This checklist is for actually implementing those Customizer options.

Bold are panels Italic are core WordPress options

chrisblakley commented 7 years ago

We could use Bootstrap classes to control which side the sidebar is on, so that could be a new option.

Here's the Bootstrap method for how I'd do this:

<div class="container">
    <div class="row">
        <div class="col-md-8">
            Content
        </div>
        <div class="col-md-3 flex-first"><!-- flex-first would be inside a conditional -->
            Sidebar
        </div>
    </div>
</div>
chrisblakley commented 7 years ago

Took care of the sidebar while I was in there adding the one-color logo options.

chrisblakley commented 7 years ago

I got the post meta options in, but we need to test it because I'm not 100% sure I got the default logic right.