Create a extra stunning list-based message within the Genesis theme
Do you create a number of list-based weblog posts and use the Genesis Framework? If sure then you definately would possibly like this.
Instance:
- 10 WordPress themes for a artistic company
- Prime 5 web optimization Optimized Joomla Templates
- 5 methods to enhance your website’s search engine rankings
A lot of these posts have one factor in widespread: amount.
A while in the past I purchased a newspaper theme from tagDiv and I favored their sensible checklist function. However I really like Genesis a lot that I have never given up. After some time I believed why not implement that function in Genesis?
A typical checklist message seems to be like this.
A sensible checklist will convert all headers into a fantastic trying quantity just like the one beneath.
Seems to be higher? Prefer it? You’ll be able to see the dwell demo in one in every of my earlier posts.
If that is one thing you are in search of, this is the code. I examined this within the Authority Professional theme, however I do not see any cause to not work with different themes.
Again up a file earlier than modifying it or testing it on a check website.
First add the next in a capabilities.php
file. This can make all h2
tag in sensible checklist.
// Smartlist metabox for publish add_action( 'add_meta_boxes', 'cd_meta_box_add' ); perform cd_meta_box_add(){ add_meta_box( 'smartlist_meta_field', 'Smartlist Metabox', 'smartlist_meta_field', 'publish', 'facet', 'excessive' ); } perform smartlist_meta_field(){ world $publish; // Noncename wanted to confirm the place the info originated echo '<enter sort="hidden" identify="smartlistmeta_noncename" id="eventmeta_noncename" worth="' . wp_create_nonce( plugin_basename(__FILE__) ) . '" />'; // Get the placement knowledge if its already been entered $test = get_post_meta($post->ID, 'smartlist_check', true); // Echo out the sphere ?> <p> <enter sort="checkbox" id="smartlist_check" identify="smartlist_check" <?php checked( $test, 'on' ); ?> worth="on" /> <label for="smartlist_check"><?php _e('Smartlist','authority-pro')?></label> </p><?php } // Save the Metabox Information perform wpt_save_smartlist_meta($post_id, $publish) { // confirm this got here from the our display screen and with correct authorization, // as a result of save_post may be triggered at different occasions if ( !wp_verify_nonce( $_POST['smartlistmeta_noncename'], plugin_basename(__FILE__) )) { return $post->ID; } // Is the consumer allowed to edit the publish or web page? if ( !current_user_can( 'edit_post', $post->ID )) return $post->ID; // OK, we're authenticated: we have to discover and save the info // We'll put it into an array to make it simpler to loop although. $smartlist_meta['smartlist_check'] = $_POST['smartlist_check']?$_POST['smartlist_check'] :''; // Add values of $smartlist_meta as customized fields foreach ($smartlist_meta as $key => $worth) { // Cycle by means of the $smartlist_meta array! if( $post->post_type == 'revision' ) return; // Do not retailer customized knowledge twice $worth = implode(',', (array)$worth); // If $worth is an array, make it a CSV (unlikely) if(get_post_meta($post->ID, $key, FALSE)) { // If the customized discipline already has a worth update_post_meta($post->ID, $key, $worth); } else { // If the customized discipline would not have a worth add_post_meta($post->ID, $key, $worth); } if(!$worth) delete_post_meta($post->ID, $key); // Delete if clean } } add_action('save_post', 'wpt_save_smartlist_meta', 1, 2); // save the customized fields // Single Publish Sensible-Listing add_action('wp_footer','geekflare_single_smartlist'); perform geekflare_single_smartlist() { if(is_single()) { world $wp_query; $postid = $wp_query->post->ID; $post_data = get_post_meta($postid); $smartlist_check = !empty($post_data['smartlist_check'][0]) ? $post_data['smartlist_check'][0] : ''; if(!empty($smartlist_check)){ ?> <script> var rely = 1; if(jQuery('.entry-content h2').size > 0) { jQuery('.entry-content h2').every(perform(){ jQuery(this).prepend( '<span class="num-count">'+rely+'</span>' ); rely++; }); } </script> <?php } } }
Then add the next in a fashion.css
file
.num-count{ background:#ff4e00; colour:#fff; padding: 0px 16px; margin-right: 15px; }
As soon as added, go to the publish you need to flip into a sensible checklist and test the field subsequent to ‘Smartlist’.
Save the message to see the end result.
You’ll be able to mess around with CSS to create a design that fits your branding. I do know it is a minor factor, nevertheless it positive makes a publish look higher than the usual publish.