Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor the background fields. #952

Closed
wants to merge 2,418 commits into from
Closed

Conversation

aristath
Copy link
Contributor

The new background field should save settings in an array instead of creating individual separate options/theme_mods.
The hard part here is making sure we don't break anyone's themes since the format will completely change.
In order to do that, we'll have to add a separate filter for options, serialized options as well as theme_mods, for each of the background sub-fields separately.

The old settings were:

  • color
  • image
  • attach
  • repeat
  • size
  • position

So we'll have to create 18 separate functions & filters in order to keep backwards-compatibility.
These will have to go in the Kirki_Field_Background class.

The desired functionality is this:
Theme using this code:

$color = get_theme_mod( 'my_bg_color' );

should check if we have a my_bg background field that has a color defined in its default values.
If we do, then we have to get the value of the get_theme_mod( 'my_bg_color' ).
If it exists, then the db has not yet been migrated, so we have to get the value of my_bg, check if we have a color there. If not, then inject the value of the previous theme_mod, and remove the theme_mod.

If the theme_mod does not exist in the db, then get the value of the new theme_mod like this:

$value = get_theme_mod( 'my_bg' );
$color = $value['color'];

After the migration functions & filters are complete we can proceed in building the actual control.

guillaumemolter and others added 30 commits April 8, 2016 09:00
Some data (image URL) for the original rendering but we don’t want to
save it in DB.

Fixes #849
# Conflicts:
#	assets/js/controls/repeater.js
I don’t think it is serving any purpose and was conflicting with other
things.
CSS fix on hidden fields. Related to #833
Change markup for the Editor Field
Don't output fields with unmet dependencies
@Rayken
Copy link

Rayken commented May 4, 2016

@aristath is there going to be support for this new background control in repeater fields?

@aristath
Copy link
Contributor Author

aristath commented May 4, 2016

It's too early to tell... currently there's nothing implemented.

@Anydog
Copy link

Anydog commented Jun 9, 2016

@aristath : just wondering - I see that "background" field is set for 3.0 milestone and not in docs anymore.
But I tryed to used it and it works. It's just UI in customizer is not so pretty.

Are there going to be changes in arguments array ?

So i know whether to ditch momentarily "background" field, and go to "combo / image / dropdown(attachment,position,repeat,size) / color" for element background ...

Thanks

@aristath
Copy link
Contributor Author

aristath commented Jun 9, 2016

The background field is a big mess...
Right now it's not a single control, it just creates sub-controls, each of them using a different setting.
So if you create a field with and ID of my_background, the actual settings that will be saved in the db will be my_background_color, my_background_image, my_background_repeat and so on.
Things become even more complicated when using serialized options instead of theme_mods, it's really messy!
The goal is to create a new control that will handle these like an array, so the actual data saved in the db will look more like this:

$saved_option = array (
    'image' => 'https://domain.com/image.png',
    'color' => '#ffffff',
    'background-repeat' => 'no-repeat',
    ...
);

The control hasn't been in the docs for about a year now, because I never liked the implementation. It was done way back when I was starting to explore the customizer API and I just needed something quick and dirty.
I'm only leaving the current implementation there for backwards-compatibility purposes!

Please avoid using the background control.... If you really need one, I would advise you to just create separate fields for the fields you need.

@Anydog
Copy link

Anydog commented Jun 9, 2016

@aristath : Thank you so much for very fast and very helpful reply ! :)
I will stick then to separate fields then, it's safer ...

Wouldn't it be good to implement solutions from "repeater" fields in ? Since "repeater" is actually a custom combo, "background" would be simpler, non-custom combo ... Just a thought, but you probably considered that a while ago ...

I wish if I only had more knowledge and time to contribute here ... And money to donate ... 😞

@lionhurt
Copy link

lionhurt commented Oct 12, 2016

@aristath: Thank you for all good stuff.

Today i am work on background field for kirki. this is my results for now:
background control

the saved value is array :
print_r(get_theme_mod('header_backgroun'))
array('color' => #fff, 'image' => 'http://image_url.png', 'repeat' => 'no-repeat'...)

handle live preview with this simple code:

wp.customize( 'header_background', function( value ) {
  value.bind( function( to ) {
    to = JSON.parse(to);
    $('.header').css({
      'background-color': to.color ? to.color : '',
      'background-image': to.image ? 'url('+to.image+')' : '',
      'background-repeat': to.repeat ? to.repeat : '',
      'background-size': to.size ? to.size : '',
      'background-position': to.position ? to.position : '',
      'background-attachment': to.attachment ? to.attachment : '',
      });

  });
});

it still need some tests .. i think it will be complete tomorrow if you still interest in this field i can send it for you

@aristath
Copy link
Contributor Author

@lionhurt hey there!

So you refactored the background field?
Can you please create a pull-request so we can easier collaborate on that and merge it when ready?
Thanks!

@lionhurt
Copy link

@aristath
Yes i add my custom background field with this method : https://aristath.github.io/kirki/docs/advanced/register-control-types.html

i will create a pull-request as soon as possible (i think it will be tomorrow)

Thanks

@ghost
Copy link

ghost commented Oct 13, 2016

Awesome work guys

On 13 Oct 2016 5:29 AM, "lionhurt" notifications@github.com wrote:

@aristath https://github.com/aristath
Yes i add my custom background field with this method :
https://aristath.github.io/kirki/docs/advanced/register-control-types.html

i will create a pull-request as soon as possible (i think it will be
tomorrow)

Thanks


You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#952 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/ABQIcOM6a1IJ_ALkgoPvMO4uOsFKSRGoks5qzS4GgaJpZM4ITgj8
.

@Anydog
Copy link

Anydog commented Oct 13, 2016

Wow, it would be great if you could merge that asap ... :)

@Rayken
Copy link

Rayken commented Oct 13, 2016

Will it work for repeaters?

On Oct 13, 2016 13:51, "Anydog" notifications@github.com wrote:

Wow, it would be great if you could merge that asap ... :)


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#952 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AEXj6NxevWJgPnczR17HmB6gbdH1PH-bks5qzhrSgaJpZM4ITgj8
.

@lionhurt
Copy link

I create a new pull request here : #1140

@lionhurt
Copy link

@Quaked

i don't test it yet.

@aristath aristath modified the milestones: 3.0, 2.4.0 Dec 10, 2016
@aristath aristath deleted the feature/background-rebuild branch March 28, 2017 20:13
@aristath aristath modified the milestones: 2.4.0, 3.0 Mar 28, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

10 participants