List of all FLEXBOX Layout properties

Since flexbox is a whole module and not a single property, it involves a lot of things including its whole set of properties. Some of them are meant to be set on the container (parent element, known as “flex container”) whereas the others are meant to be set on the children (said “flex items”).

Continue reading…

Displaying Related post

$orig_post = $post;
global $post;
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;

$args=array(
'category__in' => $category_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=> 2, // Number of related posts that will be shown.
'caller_get_posts'=>1
);

Continue reading…

DropzoneJS

DropzoneJS is an open source library that provides drag’n’drop file uploads with image previews.
http://www.dropzonejs.com/

Continue reading…

Google maps API code

Build the next generation of location experiences

We have the world mapped. With more than one billion global monthly active users in over 200 countries, our data gives you accurate real-time information for mapping, navigation and places.

Continue reading…

How to Create Custom Post Types in WordPress

We can create your own custom post types and call them whatever we want. For example if you run a Loveseats website, then you would probably want to create a Loveseats post type. This post type can have different custom fields and even its own custom category structure. Other examples of post types are: Portfolio, Testimonials, Products, etc.

1. First register post type

function fullstack_cpt() {
    $args = array(
        'public' => true,
        'label'  => 'Loveseats Item',
         'menu_icon' => 'dashicons-category',
		'supports' => array( 'title', 'editor', 'thumbnail' )
    );
    register_post_type( 'loveseats', $args );
    
}
add_action( 'init', 'fullstack_cpt' );

Continue reading…

Custom post type Query with a custom taxonomy

Firs of all don’t use query_posts() ever, read more about it here: When should you use WP_Query vs query_posts() vs get_posts()?.

You have to use WP_Query to fetch posts what you need. Read documentation for it. In your case the query could be like this:

 $args = array( 
     'posts_per_page' => -1, 
     'post_type'=>'your_post_type',
     'orderby' => 'date',
     'order' => 'ASC', 
     'tax_query' => array(
        array(
            'taxonomy' => 'your_taxonomy_name',
            'field'    => 'slug', // term_id, slug  
            'terms'    => 'your_taxonomy_slug',
        ),
       )
 );

Continue reading…

How to Create a Responsive Breakpoint in Bootstrap 4

Since Bootstrap is developed to be mobile first, we use a handful of media queries to create sensible breakpoints for our layouts and interfaces.

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) { 

}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) { 

}

Continue reading…

Twitter Bootstrap Tabs: Go to Specific Tab on Page Reload or Hyperlink

Use Bootstrap Tab and then add this JS code. That’s it!

// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href="#' + url.split('#')[1] + '"]').tab('show');
}

// Change hash for page-reload
 $('.nav-tabs a').on('shown.bs.tab', function (e) {
 window.location.hash = e.target.hash;
 window.scrollTo(0, 0);
 })

Continue reading…
Available for work