Override CSS property right to left

 

This case is an example on how to override CSS property right to left

We have this AdSense banner floating on the right side of the screen. What if you want to change it to the left
Recently, I installed Floating AdSense plugin for WordPress. It’s very helpful to add AdSense banner floating on the site.
However, this plugin floats the banner automatically on the right. Somehow, when the float option changed to left, it doesn’t work

The original code is look alike this one

#ad_divRight {
overflow: hidden;
border: 2px solid #3c95d9;
background-color: #fff;
right: 0px;
position: fixed;
top: 5%;
margin-left: 0px;
float: right;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background-color: #ffffff;
padding: 0 0 2px 0;
z-index: 10;
}

See right:0 , this forces banner ad to the right corner of the screen/site. We can override this alignment to the left with CSS with this code

#ad_divRight { left: 0 !important; right: auto !important; }

How to add ‘Show Thumbnail’ option in WPZOOM Featured Category Widget

WPZOOMFeaturedCategoryTribune is a lovely magazine theme from WPZOOM. The theme has custom widgets name WPZOOM Featured Category Widget
You could use this widget to display categories on homepage like the demo site (Politics – World – Sports – Automotive). The widget show thumbnails by default, it doesn’t have feature to disable that. What if you want a feature that allow you to show thumbnails for a category, but not for others.
It takes a little bit customization to WPZOOM Featured Category Widget

1. Open featured-category.php in functions > theme > widgets > featured-category.php

2. Replace all code between <?php and ?> in featured-category.php with following code


/*------------------------------------------*/
/* WPZOOM: Featured Category widget */
/*------------------------------------------*/
$wpzoomColors = array();
$wpzoomColors['blue'] = 'Blue';
$wpzoomColors['red'] = 'Red';
$wpzoomColors['black'] = 'Black';
class wpzoom_widget_category extends WP_Widget {

/* Widget setup. */
 function wpzoom_widget_category() {
 /* Widget settings. */
 $widget_ops = array( 'classname' => 'wpzoom', 'description' => __('Featured Category Widget for Homepage', 'wpzoom') );

/* Widget control settings. */
 $control_ops = array( 'width' => 250, 'height' => 350, 'id_base' => 'wpzoom-widget-cat' );

/* Create the widget. */
 $this->WP_Widget( 'wpzoom-widget-cat', __('WPZOOM: Featured Category', 'wpzoom'), $widget_ops, $control_ops );
 }

/* How to display the widget on the screen. */
 function widget( $args, $instance ) {
 extract( $args );

/* Our variables from the widget settings. */
 $title1 = apply_filters('widget_title', $instance['title1'] );
 $color1 = $instance['color1'];
 $posts1 = $instance['posts1'];
 $show_thumb = $instance['show_thumb'] ? true : false;
 $category1 = get_category($instance['category1']);
 if ($category1) {
 $categoryLink1 = get_category_link($category1);
 }

/* Before widget (defined by themes). */
 //echo $before_widget;

$z = 0;
 while ($z < 1)
 {
 $z++;

$color = "color$z";
 $categoryLink = "categoryLink$z";
 $title = "title$z";
 $posts = "posts$z";
 $category = $instance["category$z"];
?>
 <?php

echo '<div class="homecat '.$$color.'">';

if ( $$title ) { echo '<h4><a href="'.$$categoryLink.'">'.$$title.'</a></h4>'; } ?>

<ul>

<?php
 $second_query = new WP_Query( array( 'cat' => $category, 'showposts' => $$posts, 'orderby' => 'date', 'order' => 'DESC' ) );

$i = 0;
 if ( $second_query->have_posts() ) : while( $second_query->have_posts() ) : $second_query->the_post();
 unset($image,$cropLocation);
 $i++;
 global $post;

?>
 <li>

<div class="thumb">

<?php

$permalink = get_permalink();
 $comments = get_comments_number();
 $comment_write = '<span class="meta">'.get_the_date().'<strong>'.$comments.'</strong></span>';

if ( $show_thumb ) {

 get_the_image( array( 'size' => 'featured-cat', 'width' => 200, 'height' => 125, 'before' => '<a href="'.$permalink.'">', 'after' => $comment_write.'</a>', 'link_to_post' => false ) );

}
 ?>

</div>

<h3><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>

<p><?php the_content_limit(95); ?></p>

</li>
 <?php endwhile; ?>
 <?php endif; ?>

</ul>
 <ul class="stories">

<?php
 $slidepost = new WP_Query( array( 'cat' => $category, 'showposts' => 3, 'offset' => $$posts, 'orderby' => 'date', 'order' => 'DESC' ) );

while ( $slidepost->have_posts() ) {
 $slidepost->the_post();
 ?><li><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></li><?php
 }
 ?>

</ul>
 <?php echo '<a href="'.$$categoryLink.'" class="nextActions">'; _e('More in this category &rarr;', 'wpzoom'); echo '</a>'; ?>
 </div>

<?php

} // while
 echo ' <!-- end .featCategory -->';
 /* After widget (defined by themes). */
 //echo $after_widget;
 wp_reset_query();
 }

/* Update the widget settings.*/
 function update( $new_instance, $old_instance ) {
 $instance = $old_instance;

/* Strip tags for title and name to remove HTML (important for text inputs). */
 $instance['title1'] = strip_tags( $new_instance['title1'] );
 $instance['category1'] = $new_instance['category1'];
 $instance['color1'] = $new_instance['color1'];
 $instance['posts1'] = $new_instance['posts1'];
 $instance['show_thumb'] = $new_instance['show_thumb'];

return $instance;
 }

/** Displays the widget settings controls on the widget panel.
 * Make use of the get_field_id() and get_field_name() function when creating your form elements. This handles the confusing stuff. */
 function form( $instance ) {

/* Set up some default widget settings. */
 $defaults = array( 'title1' => __('Category Name', 'wpzoom'), 'category1' => '0', 'color1' => 'blue', 'posts1' => '3' );
 $instance = wp_parse_args( (array) $instance, $defaults );
 global $wpzoomColors;
 ?>

<p>
 <label for="<?php echo $this->get_field_id( 'title1' ); ?>"><?php _e('Category Title:', 'wpzoom'); ?></label>
 <input type="text" class="widefat" id="<?php echo $this->get_field_id( 'title1' ); ?>" name="<?php echo $this->get_field_name( 'title1' ); ?>" value="<?php echo $instance['title1']; ?>" />
 </p>

<p>
 <label for="<?php echo $this->get_field_id('color1'); ?>"><?php _e('Title Background Color:', 'wpzoom'); ?></label>
 <select id="<?php echo $this->get_field_id('color1'); ?>" name="<?php echo $this->get_field_name('color1'); ?>" style="width:90%;">
 <?php
 foreach ($wpzoomColors as $key => $value) {
 $option = '<option value="'.$key;
 if ($key == $instance['color1']) { $option .='" selected="selected';}
 $option .= '">';
 $option .= $value;
 $option .= '</option>';
 echo $option;
 }
 ?>
 </select>
 </p>

<p>
 <label for="<?php echo $this->get_field_id('category1'); ?>"><?php _e('Category:', 'wpzoom'); ?></label>
 <select id="<?php echo $this->get_field_id('category1'); ?>" name="<?php echo $this->get_field_name('category1'); ?>" style="width:90%;">
 <option value="0">Choose category:</option>
 <?php
 $cats = get_categories('hide_empty=0');

foreach ($cats as $cat) {
 $option = '<option value="'.$cat->term_id;
 if ($cat->term_id == $instance['category1']) { $option .='" selected="selected';}
 $option .= '">';
 $option .= $cat->cat_name;
 $option .= ' ('.$cat->category_count.')';
 $option .= '</option>';
 echo $option;
 }
 ?>
 </select>
 </p>

<p>
 <label for="<?php echo $this->get_field_id('posts1'); ?>"><?php _e('Posts to show:', 'wpzoom'); ?></label>
 <select id="<?php echo $this->get_field_id('posts1'); ?>" name="<?php echo $this->get_field_name('posts1'); ?>" style="width:90%;">
 <?php
 $m = 0;
 while ($m < 11) {
 $m++;
 $option = '<option value="'.$m;
 if ($m == $instance['posts1']) { $option .='" selected="selected';}
 $option .= '">';
 $option .= $m;
 $option .= '</option>';
 echo $option;
 }
 ?>
 </select>
 </p>
 <p>
 <input class="checkbox" type="checkbox" <?php checked( $instance['show_thumb'], 'on' ); ?> id="<?php echo $this->get_field_id( 'show_thumb' ); ?>" name="<?php echo $this->get_field_name( 'show_thumb' ); ?>" />
 <label for="<?php echo $this->get_field_id( 'show_thumb' ); ?>">Display post thumbnail</label>
 </p>

<?php
 }
}

function wpzoom_register_category_widget() {
 register_widget('wpzoom_widget_category');
}
add_action('widgets_init', 'wpzoom_register_category_widget');

3. Select/Deselect Display Post Thumbnail on the widget
4. Done

Enable Formatting Tags for Content Limit in Genesis Featured Posts widget

gallerygenesis

Genesis Framework has same function that return the content after trimming and it strips all HTML
The following code help you keep or filter some HTML tags when you are using Content Limit in Theme Settings or Widgets (e.g Genesis – Featured Posts widget)

Add following to functions.php in the Genesis Framework child theme


add_filter('get_the_content_limit_allowedtags', 'childtheme_custom_allowedtags');
function childtheme_custom_allowedtags() {
return '&lt;script&gt;,&lt;style&gt;,&lt;b&gt;,&lt;br&gt;,&lt;em&gt;'; //add whatever tags you want to this string
}

The code been tested on Gallery Child Theme for Genesis Framework

Keep HTML Tags in WordPress Limit Posts – the_content_limit

WordPress - the logoThis function, the_content_limit  controls the maximum amount of characters displayed for an entry on the main page on WordPress homepage posts, e.g Featured Posts, Recent Posts
However , the_content_limit stripped HTML tags just like the_excerpt. What if we want to keep HTML tags

We make modification to the function, the_content_limit which is usually found in functions.php


function the_content_limit($max_char, $more_link_text = '(more...)', $stripteaser = 0, $more_file = '') {
$content = get_the_content($more_link_text, $stripteaser, $more_file);
// remove  shortcode
$content = preg_replace("/\/", '', $content);
// short codes are applied

$content = apply_filters('the_content', $content);
$content = str_replace(']]>', ']]>', $content);
$content = strip_tags($content,'
,<b>,<strong>,<a>,<i>,
');

if ((strlen($content)>$max_char) && ($espacio = strpos($content, " ", $max_char ))) {
$content = substr($content, 0, $espacio);
$content = $content;
echo "
";
echo $content;
echo "...";
echo "

";
}
else {
echo "
";
echo $content;
echo "

";
}
}

We remove $content = strip_tags($content);  from original code of the_content_limit and replace it with $content = strip_tags($content,'<p>,<b>,<strong>,<a>,<i>,<br>’);
This will allow the_content_limit to show paragraph, bold texts, italic texts.

What is strip_tags?

We can remove all html tags from the content by using strip_tags string function in PHP. This function can be used to collect only the content part without reading the html formatting of the page. Here is the syntax

strip_tags (input string [, string allowable_tags])

This function also allows one optional string where we can keep the tags which are not to be removed. Say we don’t want the hyper links to be removed. So we will allow the linking tag <a href to be kept as it is. Here is the syntax for this.

strip_tags($string_str, ‘<a>’);

In the above code $string_str is the input string, in our case it is $content

Change Default WordPress Logo Link from wordpress.org to Your Domain Name

WordPress - the logoWhen you open WordPress login page, the default logo links to WordPress.org. This is a quick tip for using your own link. Open the functions.php file. Then, add the following lines of code. And be sure to remember the PHP tag enclosure.

function wp_url_loginlogo(){
	return "http://yourdomain.com/"; // your URL here
}
add_filter('login_headerurl', 'wpc_url_loginlogo');