class ThemeTruck_Nav_Walker extends Walker_Nav_Menu {
private $curItem;
// retrieve the curItem
function start_lvl(&$output, $depth = 0, $args = array()) {
var_dump($this->curItem );
}
// store the curItem
function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
$this->curItem = $item;
}
}
Reset positions of metaboxes in admin
SELECT *
FROM `wp_usermeta`
WHERE `user_id` =1
AND `meta_key` LIKE 'meta-box%'Building a morphing hamburger menu with css
$menu_name = 'primary';
$locations = get_nav_menu_locations();
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
?>
WordPress Ajax call
<script>
// Ajax call to get a single dealer
// fetch_individual_dealer() in functions.php
function fetch_individual_dealer_information(id) {
// We'll pass this variable to the PHP function fetch_dealers
var dealer_id = id;
var ajaxurl = "<?php echo admin_url('admin-ajax.php')?>";
var mobile_dealer = $('#mobile-dealer');
var loader = $('.uil-spin-css-container');
loader.show();
// This does the ajax request
if (dealer_id) {
$.ajax({
url: ajaxurl,
data: {
'action':'fetch_individual_dealer',
'dealer_id' : dealer_id
},
success:function(data) {
// console.log(data);
loader.hide();
mobile_dealer.empty();
mobile_dealer.append(data);
},
error: function(errorThrown){
console.log(errorThrown);
}
});
} else {
}
}
$("#dealers").change(function() {
fetch_individual_dealer_information(marker_id);
});
</script>
<div class='uil-spin-css-container'>
<div class='uil-spin-css'>
<div><div></div></div><div><div></div></div><div><div></div></div><div><div></div></div><div><div></div></div><div><div></div></div><div><div></div></div><div><div></div></div>
</div>
</div>
<div id="mobile-dealer" class="visible-xs">
<article>
<div class="row">
<div class="col-xs-4"><img src="http://website.com/wp-content/uploads/2016/04/image-150x150.jpg" class="img-responsive"></div>
<div class="col-xs-8">
<h5>Outdoor World</h5>
<h6>Bunbury</h6>
<p>4 Halifax Road, Bunbury, WA, 6230<br>
<strong>Phone:</strong> 08 9725 6166</p>
</div>
</div>
<a href="https://www.google.com/maps?daddr=-33.358775,115.66869199999996" class="btn white">Get Directions</a>
<a href="http://website.com/blog/dealer/bunbury/" class="btn arrow black">Dealer Details</a>
</article>
</div>
In Functions.php
function fetch_individual_dealer() {
// The $_REQUEST contains all the data sent via ajax
if ( isset($_REQUEST) ) {
$dealer_id = $_REQUEST['dealer_id'];
$dealer_suburb = get_the_title($dealer_id);
$dealer_name = get_field('dealer_name', $dealer_id);
$dealer_phone = get_field('delaer_phone', $dealer_id);
$dealer_address = get_field('dealer_store_address', $dealer_id);
$dealer_image = get_field('featured_image', $dealer_id);
$dealer_image_thumbnail = $dealer_image['sizes']['thumbnail'];
$categories = get_the_terms( $post->ID, 'dealer_state' );
if ($dealer_image_thumbnail) {
$image_column = '<div class="col-xs-4"><img src="'.$dealer_image_thumbnail.'" class="img-responsive"></div>';
} else {
$image_column = '';
}
$html = '
<article>
<div class="row">
'.$image_column.'
<div class="col-xs-8">
<h5>'.$dealer_name.'</h5>
<h6>'.$dealer_suburb.'</h6>
<p>'.$dealer_address['address'].'<br>
<strong>Phone:</strong> '.$dealer_phone.'</p>
</div>
</div>
<a href="https://www.google.com/maps?daddr='.$dealer_address['lat'].','.$dealer_address['lng'].'" class="btn white">Get Directions</a>
<a href="'. get_permalink($dealer_id).'" class="btn arrow black">Dealer Details</a>
</article>
';
echo $html;
}
// Always die in functions echoing ajax content
wp_die();
}
add_action( 'wp_ajax_nopriv_fetch_individual_dealer', 'fetch_individual_dealer' );
add_action( 'wp_ajax_fetch_individual_dealer', 'fetch_individual_dealer' );
Bootstrap 3 change grid column count and gutter width using SASS
/************************************
***** column vars
*************************************/
$new-columns : 12;
$new-gutter-width : 40px;
$grid-columns : $new-columns;
$grid-gutter-width : $new-gutter-width;
@mixin column-adjust($column,$gutter) {
// set custom variables for our grid structure
$grid-columns: $column !global;
$grid-gutter-width: $gutter !global;
.row {
@include make-row();
}
@include make-grid-columns();
// @include make-grid(xs);
@media (min-width: $screen-sm-min) {
@include make-grid(sm);
}
@media (min-width: $screen-md-min) {
@include make-grid(md);
}
@media (min-width: $screen-lg-min) {
@include make-grid(lg);
}
// reset global vars;
$grid-columns: $new-columns !global;
$grid-gutter-width: $new-gutter-width !global;
}
@import 'vars';
@import 'mixins';
/************************************
***** grid changes
*************************************/
.grid {
&.grid-10-across {
@include column-adjust(10, $grid-gutter-width );
}
&.grid-24-across {
@include column-adjust(24, $grid-gutter-width );
}
}
.gutter-slim {
&.gutter-slim-10 {
@include column-adjust($new-columns, 10px );
}
&.gutter-slim-6 {
@include column-adjust($new-columns, 6px );
}
}