Title: pattern_replace Assistance
Last modified: June 22, 2018

---

# pattern_replace Assistance

 *  Resolved [ThemeAWESOME](https://wordpress.org/support/users/tsquez/)
 * (@tsquez)
 * [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/)
 * Hi there,
 * So I find myself in need of your assistance once again and I hope this is an 
   easy one. For me it’s got me like “WTF”…lol.
 * Anywho, its about using `pattern_replace` and I have read over your documentation
   on it and I can’t seem to get it to work. Unfortunately I got frustrated, deleted
   my code and walked away…lol. This was yesterday. So I thought I would come over
   and ask.
 * I am trying to add color controls for a off canvas menu hamburger icon. If you
   look at this site in mobile view you will get what I am talking about: [https://themeawesome.com/themes/wpforge/](https://themeawesome.com/themes/wpforge/)
 * Now it has css like this:
 *     ```
       .menu-icon::after {
           background: #fefefe;
           box-shadow: 0 7px 0 #fefefe, 0 14px 0 #fefefe;
       }
       ```
   
 * SO I would like to give the user the ability to change the color of the hamburger
   icon to whatever they wish and I believe the `pattern_replace` is the way to 
   go.
 * I just can’t seem to wrap my head around it. Could you possibly help and show
   me what I may need to do?
 * Any help is greatly appreciated. Thanks in advance.

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Ari Stathopoulos](https://wordpress.org/support/users/aristath/)
 * (@aristath)
 * [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/#post-10433125)
 * `pattern_replace` is useful when building complex CSS that depends on more than
   1 settings.
    In your case since you only want this to depend on a single control,
   you can use `value_pattern`:
 *     ```
       'output' => array(
       	array(
       		'element'  => '.menu-icon::after',
       		'property' => 'background',
       	),
       	array(
       		'element'       => '.menu-icon::after',
       		'property'      => 'box-shadow',
       		'value_pattern' => '0 7px 0 $, 0 14px 0 $'
       	),
       ),
       ```
   
 * `pattern_replace` would be useful if for example you had 2 controls and you wanted
   to create a gradient from one value to the other, for example something like
   `
   background: linear-gradient($value1, $value2);` In your case it’s not necessary
   🙂
    -  This reply was modified 7 years, 11 months ago by [Ari Stathopoulos](https://wordpress.org/support/users/aristath/).
    -  This reply was modified 7 years, 11 months ago by [Ari Stathopoulos](https://wordpress.org/support/users/aristath/).
 *  Thread Starter [ThemeAWESOME](https://wordpress.org/support/users/tsquez/)
 * (@tsquez)
 * [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/#post-10433619)
 * Ah OK I see what your saying. Makes sense.
 * I will give it a try and see what happens. I’ll stop back in and let yah know
   how it goes.
 * Thanks again for the help.
 *  Thread Starter [ThemeAWESOME](https://wordpress.org/support/users/tsquez/)
 * (@tsquez)
 * [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/#post-10433640)
 * Just wanted to stop back by and let yah know it worked perfectly.
 * The cool thing is that I understand what the code is doing, which is pretty neat.
 * Thanks again for taking the time to assist and for the awesome plugin 😉
 *  [Ari Stathopoulos](https://wordpress.org/support/users/aristath/)
 * (@aristath)
 * [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/#post-10433647)
 * Glad I could help.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘pattern_replace Assistance’ is closed to new replies.

 * ![](https://ps.w.org/kirki/assets/icon-256x256.jpg?rev=3518366)
 * [Kirki – Freeform Page Builder, Website Builder & Customizer](https://wordpress.org/plugins/kirki/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/kirki/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/kirki/)
 * [Active Topics](https://wordpress.org/support/plugin/kirki/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/kirki/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/kirki/reviews/)

 * 4 replies
 * 2 participants
 * Last reply from: [Ari Stathopoulos](https://wordpress.org/support/users/aristath/)
 * Last activity: [7 years, 11 months ago](https://wordpress.org/support/topic/pattern_replace-assistance/#post-10433647)
 * Status: resolved