Wordpress- WordPress Post Pagination without plugin

STEP 1. Add the following function to your functions.php file:
 
 
function pagination($pages = '', $range = 2)
{  
     $showitems = ($range * 2)+1;  

     global $paged;
     if(empty($paged)) $paged = 1;

     if($pages == '')
     {
         global $wp_query;
         $pages = $wp_query->max_num_pages;
         if(!$pages)
         {
             $pages = 1;
         }
     }   

     if(1 != $pages)
     {
         echo "\n";
     }
}

STEP 2. To style it, add the following to your stylesheet (typically style.css).
.pagination {
 clear:both;
 padding:20px 0;
 position:relative;
 font-size:11px;
 line-height:13px;
}
.pagination span, .pagination a {
 display:block;
 float:left;
 margin: 2px 2px 2px 0;
 padding:6px 9px 5px 9px;
 text-decoration:none;
 width:auto;
 color:#fff;
 background: #555;
}
.pagination a:hover{
 color:#fff;
 background: #3279BB;
}
.pagination .current{
 padding:6px 9px 5px 9px;
 background: #3279BB;
 color:#fff;
}
STEP 3: Final step, Put in your template file:
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$arg= array('post_type' => 'post-type',
   'taxonomy' => 'texonomy-slug',
   'term'=> 'term-slug',
   'paged' => $paged,
   'posts_per_page' => 5,
   'orderby' => 'date',
   'post_status'=>'publish'                                                                       
     );
$loop = new WP_Query($arg);
?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
 
<?php endwhile; ?>

<?php if (function_exists("pagination")) {
    pagination($loop->max_num_pages);
} 

Wordpress plugin - Category and Taxonomy Image


Features :
  • Setting for taxonomy,image field to be enabled.
  • Very simple in use
  • Can be customized easily.
Installation:
  1. Unzip into your /wp-content/plugins/ directory. If you're uploading it make sure to upload the top-level folder. Don't just upload all the php files and put them in /wp-content/plugins/.
  2. Activate the plugin through the 'Plugins' menu in WordPress
  3. Go to your WP-admin ->Settings menu a new "Taxonomy Image" page is created.
  4. Go to your WP-admin ->Settings ->Taxonomy Image displayed in the taxonomies list form where you can select the taxonomies you want to include it in WP Custom Taxonomy Image.
  5. Go to your WP-admin select any category/term ,here image text box where you can manage image for that category/term.
  6. you can use the following function into your templates to get category/term image:
 
if (function_exists('get_wp_term_image'))
{
   $meta_image = get_wp_term_image($term_id); 
   //It will give category/term image url 
}

echo $meta_image; // category/term image url
where $term_id is 'category/term id'


Screenshots :





WP Custom Taxonomy Image Plugin allow you to add image with category/taxonomy..

Wordpress plugin - Client Logo Carousel

Display client logos responsive carousel with the help of a shortcode in editor as well as template page. Having different carousel settings.

Features :
  • Simple and light weight
  • Fully responsive
  • Having different settings in admin
  • Ability to add client links to each logo
  • Auto slide option
Installation:
  1. Upload the folder "wp-client-logo-carousel" to "/wp-content/plugins/" '
  2. Activate the plugin through the "Plugins" menu in WordPress .
  3. Update settings for carousel going to wp-admin->WP Client Logo->Logo Carousel Settings
  4. Add client logo going to wp-admin->WP Client Logo->Add New Client Logo..
  5. Call shortcode to your wordpress editor directly, by using
[wpaft_logo_slider]
Call shortcode to your php template file using
 
echo do_shortcode('[wpaft_logo_slider]');
Carousel By category *
To show logos from a particular category. We can call shortcode to our wordpress editor directly, by using
 
[wpaft_logo_slider category="SLUG OF CAROUSEL CATEGORY"]
* And we can call shortcode to our php template file using
  
echo do_shortcode('[wpaft_logo_slider category="CAROUSEL CATEGORY SLUG"]');
NOTE: Be sure the 'SLUG OF CAROUSEL CATEGORY' is the slug of category.

Screenshots :






Download plugin:

Magento 1.9 - getBaseUrl retrieving different urls

Magento getBaseUrl retrieving different urls

There are multiple ways. For examples:-

1. http://yourdomain.com/

echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); 

2. http://yourdomain.com/index.php/

echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_LINK); 

3.http://yourdomain.com/js/

 
echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_JS); 

4.http://yourdomain.com/media/

echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA); 

5.http://yourdomain.com/skin/

 
echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_SKIN); 

Magento - How to show all products of a category in only one page

Question: How can we show all products of a category in only one page?
Answer: You can find the solution in Magento backend,

it's like this :
Configuration > catalog > frontend > Allow All Products per Page > yes 

Woocommerce- Change number or products per row to 3

Question: How can we change number or products per row to 3 in woocommerce?
Answer:  We can this adding below filter in functions.php

// Change number or products per row to 3
add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) {
    function loop_columns() {
        return 3; // 3 products per row
    }
} 

SSH- How to zip a folder via SSH Terminal

This is how you can zip a folder via SSH on your Linux server. Works on Debian and other servers.

zip -r filename.zip foldername/

jQuery- Stop YouTube video within iFrame on external Button click

 
//First get the  iframe URL
var url = jQuery('#YourIFrameID').attr('src');

//Then assign the src to null, this then stops the video been playing
jQuery('#YourIFrameID').attr('src', '');

// Finally you reasign the URL back to your iframe, so when you hide and load it again you still have the link
jQuery('#YourIFrameID').attr('src', url);

jQuery- show div on hover - hide div on mouseout

Question: How can we show div on hover and hide div on mouseout ?

Answer: Using below example code we can do this.

HTML
hover anchor

lorem ipsum dolor sit amet......

JS
(function(){
  var del = 200;
  $('.icontent').hide().prev('a').hover(function(){
    $(this).next('.icontent').stop('fx', true).slideToggle(del);
  });
})();

Magento 1.9 - Add to cart button on upsell product page in magento

To add "add to cart" button on upsell product page-

Follow below steps : -

STEP 1. open the upsell.phtml page:-

i.e.
app/design/frontend/default/your theme/template/catalog/product/list/upsell.phtml

STEP 2. Put the code where button to show-


Enjoy:)

jQuery- Toggle Up and Dowm

HTML:
 

Click 1

Click 2

SCRIPT:
 
jQuery(document).ready(function() {
    jQuery('#faq-list h2').click(function() {
       jQuery(this).next('.answer').slideToggle(500);
       jQuery(this).toggleClass('close');
       
    });
}); // end ready
Important: Please make sure, jQuery library is included in the page.

PHP- How can we convert string to slug?

Below is the function to convert string to slug.
 
function createSlug($str, $delimiter = '-'){

$slug = strtolower(trim(preg_replace('/[\s-]+/', $delimiter, preg_replace('/[^A-Za-z0-9-]+/', $delimiter, preg_replace('/[&]/', 'and', preg_replace('/[\']/', '', iconv('UTF-8', 'ASCII//TRANSLIT', $str))))), $delimiter));
  
 return $slug;

}
For example:
 
$str= 'this is slug'; //If this is the string which we have to convert as slug
$createdSlug= createSlug($str); //Call funtion
echo $createdSlug; // Print output
Output:
 
this-is-slug

Wordpress- How to disable responsive images srcset in WP 4.4+

We have to just paste below code in theme's function.php
 
//disable src set
function aft_disable_srcset( $sources ) {
    return false;
}
add_filter( 'wp_calculate_image_srcset', 'aft_disable_srcset' );

Wordpress- How can we customize custom logo dimension in child theme?

Question: How can we customize custom logo dimension in child theme?

Answer: Putting following code/hook in child theme functions.php, logo dimension could be customized.

If we want to add width=500 and height=200 for logo, we can use below filter.

add_action( 'after_setup_theme', 'child_theme_logo_customize', 99 );
function child_theme_logo_customize() {
    add_theme_support( 'custom-logo', array(
        'width'  => 500,
        'height' => 200,
    ) );
} 

CSS- Creating full width (100% ) container inside fixed width container.


Question: How can we create full   width (100% ) container inside fixed width container with CSS?
 
Answer: Some times we need to add a full width containers (which spans 100% of window) inside a container which has a fixed width and aligned center.

Like below screenshot-

HTML
 

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

--- Full width container ---

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

CSS
 
.row-full{
 width: 100vw;
 position: relative;
 margin-left: -50vw;
 height: 100px;
 left: 50%;
 background-color:red;
}