Skip to content

Instantly share code, notes, and snippets.

View DevShahidul's full-sized avatar

Shahidul Islam DevShahidul

View GitHub Profile
View Include theme css and js with functions in wordpress
// Begin Include theme css and js function
function add_theme_css_js(){
// Include css
wp_register_style( 'foonts', ',500,600,700', array(), '1.0', 'all' );
wp_register_style( 'flexslider', get_template_directory_uri() . '/css/flexslider.css', array(), '2.0', 'all' );
wp_register_style( 'stylesheet', get_template_directory_uri() . '/css/style.css', array(), '1.0', 'all' );
View Nave Menu Register
1. Register menu in function
// Register navigation
function register_theme_menu(){
register_nav_menus(array( // Using array to specify more menus if needed
'main_menu' => 'Main menu',
'footer_menu' => 'Footer Menu'
add_action('init', 'register_theme_menu');
View Create Feature image with background image
if ( have_posts() ) : while ( have_posts() ) : the_post();
if ( has_post_thumbnail() ) {
$feat_image_url = wp_get_attachment_url( get_post_thumbnail_id() );
echo '<div style="background-image:url('.$feat_image_url.');"></div>';
DevShahidul / jquery.rwdImageMaps.min.js
Last active May 31, 2017 10:55
Responsive maping
View jquery.rwdImageMaps.min.js
// Calling script
if( $('').length){
* rwdImageMaps jQuery plugin v1.5
View Scroll top with definite section.js
var contentNav = $('section.hero-section').height()
if($(window).scrollTop() > contentNav ){
DevShahidul / Input field focus and blur advance function.js
Created June 3, 2017 05:10
This function for input active state on focus with value added and value removed state.
View Input field focus and blur advance function.js
// Begin input common focus and blur for value.
View Expand Search box with click submit btn function.html
/* Search box style */
.search-wrap{position: absolute; right: 0; top: 15px; z-index: 1;}{z-index: 3;}
.search-form-warp{float: left; width: 100%; position: relative;}
.expand-btn{position: absolute; right: 0; width: 35px; height: 35px; background: transparent; z-index: 5; cursor: pointer;}
.value-added .expand-btn{z-index: 2;}
.input-field{position: absolute; top: 0; right: 45px; width: 200px; height: 35px; z-index: 5; overflow: hidden;}
.search-wrap input[type="text"]{float: left; border: 1px solid #dfded8; color: #dfded8; padding: 0 10px; display: block; position: absolute; top: 0; right: -200px; width: 200px; height: 35px; margin: 0; padding: 0 10px; font-size: 18px; -webkit-backface-visibility: none; -moz-backface-visibility: none; -ms-backface-visibility: none; backface-visibility: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-transition: right 0.3s; -moz-transition: right 0.3s; -ms-transition: r
DevShahidul / Dropdown script.js
Last active September 23, 2017 14:09
This code for drop down navigation function
View Dropdown script.js
$('.main-nav ul li, .footer-nav-mobi ul li').find('ul').addClass('dropdownNav')
$('.main-nav ul li, .footer-nav-mobi ul li').find('ul').parent().addClass('hasDropdown')
if($(window).width() < 768){
$('.main-nav ul li.hasDropdown > a, .footer-nav-mobi ul li.hasDropdown a').bind('click','touchend', function(e){
$('.main-nav li.hasDropdown, .footer-nav-mobi ul li.hasDropdown').removeClass('active')
$('.main-nav li.hasDropdown, .footer-nav-mobi ul li.hasDropdown').find('> ul:visible').slideUp()
View FlexSlider.html
<!DOCTYPE html>
<style type="text/css">
File name ===>> flexslider.css
View Increase and Decrease Function in css with jQuery.js
// This is One way
var delayTime = 0.3
$('.nav-wrap ul li').each(function(a){
var thisDelay = delayTime * a
thisDelay = thisDelay + "s"
"transition-delay" : thisDelay,
//"opacity" : 1