Tagged: dynamic css, embedded css with piklist, generate internal css, get_options, pass piklist data to get_options, use piklist with get_options, write css to the head, write piklist data to the head section
- This topic has 2 replies, 2 voices, and was last updated 5 years, 7 months ago by
semwangajoshua.
-
AuthorPosts
-
-
June 24, 2016 at 6:47 am #6796
semwangajoshuaMemberWhile trying to solve the Image upload control bug that I get when the Customizer has an Image upload control and the Piklist is actived, I came across the piece of code below by Steve and I thought that I could help me dodge using the Customizer if it could write style info to the head section of the page. This is the code:
add_action('wp_head', 'my_custom_css'); function my_custom_css() { $options = get_option('test_field'); ?> <style type="text/css"> html { color: <?php echo $options['color']; ?>; } </style> <?php }N.B: The code above returns no error and neither data even though I have colorpicker field in my settings file saved with a color value.
What I’m trying to do is this; I’m trying to upload an image and then use its url for in an Internal style that is write in the head section of the page. So, for example in the code above, I’m trying to pull the value of a field in my settings file, preferrably an image url and then pass it to the wp_head action hook so that it’s passed as a property value in the generated Internal css. I’ve also tried this code below but to no avail.
<?php add_action('wp_head', 'my_custom_css'); function my_custom_css() { $options = get_option('test_field'); $theme_options = get_option('my_theme_settings'); $text_field = $theme_options['text']; $select_field = $theme_options['select']; $colorpicker_field = $theme_options['colorpicker']; ?> <style type="text/css"> html { /*color: <?php echo $options['color']; ?>;*/ <?php echo 'This is a text field' . $text_field; ?> } </style> <?php } ?>None of the above fields/options returns anything apart from an error like the one below claiming the field to undefined.
<b>Notice</b>: Undefined index: text in <b>C:\xampp\htdocs\lawyeah\wp-content\themes\JointsWP-CSS-master\functions.php</b> on line <b>121</b><br />
Note: Text, select and colorpicker are actual field names in the settings file and the code is placed in functions.php file. I’ve not used an image field here because I was just testing to see if actually anything was being returned. I’ve tried to run the code from a different place like the same directory level like that of the page templates; but still nothing works. Could you please help me solve this. How do I get the url of an image attached in the settings file show up as a property value in the Internal css in the head section? Thanks for the support. -
June 27, 2016 at 11:12 am #6809
SteveKeymaster@semwangajoshua– That code I posted needs to be tweaked to your SETTINGS and FIELD name. What’s the name of your colorpicker field? When created it, what did you use for the
fieldparameter?Also, what did you register for your settings?
-
July 1, 2016 at 6:38 am #6867
semwangajoshuaMemberI have an image that I upload using the control below:
//Section 5 Highlight Image piklist('field', array( 'type' => 'file' ,'field' => 'slideimage1' //,'scope' => 'post_meta' ,'label' => __('Slide-1 Image','piklist') ,'description' => __('Add an image for slide-1','piklist') ,'options' => array( 'modal_title' => __('Add Image','piklist') ,'button' => __('Add Image','piklist') ) ));And this is code that registers all my Piklist settings in functions.php:
//Register Piklist Functionality add_filter('piklist_admin_pages', 'piklist_theme_setting_pages'); function piklist_theme_setting_pages($pages) { $pages[] = array( 'page_title' => __('Custom Settings') ,'menu_title' => __('Theme settings', 'piklist') //,'sub_menu' => 'themes.php' //Under Appearance menu ,'capability' => 'manage_options' ,'menu_slug' => 'tactile_custom_settings' ,'setting' => 'tactile_theme_settings' ,'menu_icon' => plugins_url('piklist/parts/img/piklist-icon.png') ,'page_icon' => plugins_url('piklist/parts/img/piklist-page-icon-32.png') ,'single_line' => true ,'default_tab' => 'General' ,'save_text' => 'Save Settings' ); return $pages; }I’m trying to output the url of that uploaded image as a background-image property value of a certain selector so that wp_head writes it out in the embeddeded css styles. That way, I can even make a slideshow from it. May you please show me how to do that coz I’m stuck.
-
-
AuthorPosts
- You must be logged in to reply to this topic.