ארכיון: סניפטים וקטעי קוד | עמוד 4

גלילה חלקה (Smooth Scroll) ל ID בעזרת jQuery

סניפט קצר בו אני משתמש רבות כשאני נדרש לבצע גלילה לאלמנט מסויים (by ID). פשוט שנו את ׳600׳ למהירות בה אתם רוצים שהגלילה תתבצע (ms) וזהו. אתם יכולים גם לשנות את הסלקטור a[href*="#"] כמובן לאיזה סלקטור שתבחרו.

$('a[href*="#"]').on('click', function (e) {
	e.preventDefault();

	$('html, body').animate({
		scrollTop: $($(this).attr('href')).offset().top
	}, 600, 'linear');
});

נחמד לא? מוזמנים לתת מבט בדמו שיצרתי ב Codepen.  אם אתם נתקעים אגב בבעיות של גלילה שאינה חלקה, ובכלל בעיות של ביצועי גלילה ו Frontend, אז תנו מבט בקישור המצורף מספר מילים קודם לכן… 🙂

אכלתי את הראש, אבל הנה גם פוסט המתאר כיצד ליצור אנימציות גלילה (On-Scroll Animations) ממש נחמדות באמצעות הספרייה AOS.

הפניית המשתמש לעמוד התשלום לאחר הוספת מוצר לעגלת הקניות בווקומרס

ישנה אפשרות מובנית בווקומרס להפנות את כל המשתמשים לעמוד עגלת הקניות ( Cart Page) ברגע שהוסיפו מוצר לעגלה. האופציה לעשות זאת נמצאית תחת ווקומרס > הגדרות > מוצרים > ״התנהגות הוספה לסל הקניות״.

אך אם אתם מעוניינים להפנות את הגולשים ישירות לעמוד התשלום (Checkout Page) הוסיפו את הקוד הבא לקובץ functions.php של תבנית הבת הפעילה (או של התבנית).

function custom_add_to_cart_redirect( $url ) {
    $url = WC()->cart->get_checkout_url();
    return $url;
}
add_filter( 'woocommerce_add_to_cart_redirect', 'custom_add_to_cart_redirect' );

קוד זה יפנה את המשתמשים ישירות לעמוד התשלום לאחר הוספת מוצר לעגלת הקניות בווקומרס. באותו נושא, כדאי לתת מבט בפוסט הקפצת הודעה לאחר הוספת מוצר לעגלת הקניות באתרי ווקומרס.

גם באותו נושא – תוכלו למצוא עוד מידע על דרכים להוספת שדות ומודיפיקציה לעמוד התשלום של ווקומרס תמצאו בפוסט עמוד תשלום בווקומרס – כיצד לשנות ולהוסיף שדות..

הגבלת החיפוש בוורדפרס לסוג תוכן ספציפי (Custom Post Type)

הסניפט הבא מאפשר לכם להגביל את החיפוש בוורדפרס לסוג תוכן ספציפי (Custom Post Types) כך שיתקבלו תוצאות אך ורק מסוג תוכן זה. הוסיפו ל functions.php וקבעו בשורה מספר 4 את סוג או סוגי התוכן עליהן יתבצע החיפוש.

function SearchFilter($query) {
  if ($query->is_search) {
    // Insert the specific post type you want to search
    $query->set('post_type', 'feeds');
  }
  return $query;
}

// This filter will jump into the loop and arrange our results before they're returned
add_filter('pre_get_posts','SearchFilter');

הסרת שדה URL / Website מהתגובות בוורדפרס

התגובות בוורדפרס מגיעות כברירת מחדל עם שדה בשם ״אתר״ (באנגלית שמו Website או URL) בדרך כלל. אם אתם מעוניינים להסיר שדה זה, בין אם לצורך עיצובי ובין אם פשוט להסיר עוד שדה אשר בד״כ אינו הכרחי ונחוץ, השתמשו בסניפט הבא (functions.php):

function savvy_disable_comment_url($fields) {
    unset($fields['url']);
    return $fields;
}
add_filter('comment_form_default_fields','savvy_disable_comment_url');

הפעלת מצב תחזוקה בוורדפרס (Maintenance Mode)

צריכים דרך מהירה להכנס למצב תחזוקה בוורדפרס? השתמשו בסניפט הבא. פשוט שימו אותו כהערה במידה ואתם רוצים לבטל את מצב התחזוקה…

function maintenace_mode() {

	if ( !current_user_can( 'edit_themes' ) || !is_user_logged_in() ) {
		die('Maintenance.');
	}
}
add_action('get_header', 'maintenace_mode');

וורדפרס - תמונות Animated Gifs לא עובדות?

לאחרונה ניסיתי להעלות Animated Gif לפוסט שכתבתי בוורדפרס, לאחר השמירה גיליתי שהאנימציה של ה GIF אינה עובדת. הסתבר (ומאד הגיוני) שהעניין הוא שלא השתמשתי בגודל תמונה המלא אלר בגירסה שהיא Cropped.

כאשר וורדפרס מייצרת גודל תמונה חדש היא מסירה את הפריימים של האנימציה ב GIF ומכאן שעליכם תמיד להתמש בגודל התמונה המלא על מנת לראות את האנימציה. הנה תמונה המראה היכן עליכם לבחור את גודל התמונה כאשר אתם מעלים אותו לפוסט כלשהו:

גודל תמונה מלא לאנימציית GIF

הוספת משתמש חדש דרך functions.php

אם נתקעתם ללא גישה למסד הנתונים או גישה ל phpMyAdmin, ואם אין לכם אפשרות לשחזר סיסמה דרך ממשק הניהול של וורדפרס, תנו מבט בקוד הבא.

הוסיפו אותו לקובץ functions.php בתבנית שלכם, שנו את הפרטים בשורות 2-4 (לכאלו שלא קיימים למשתמש קיים כלשהו), ובפעם הבאה שתגשו למסך ההתחברות של וורדפרס ייווצר משתמש חדש בעל הרשאות מנהל ותוכלו להתחבר.

function sv_wp_admin_account(){
	$user = 'Username';
	$pass = 'Password';
	$email = 'email@domain.co.il';
	if ( !username_exists( $user )  && !email_exists( $email ) ) {
		$user_id = wp_create_user( $user, $pass, $email );
		$user = new WP_User( $user_id );
		$user->set_role( 'administrator' );
	} }
add_action('init','sv_wp_admin_account');

אתם מוזמנים לתת מבט על הדרך במאמר איפוס סיסמה בוורדפרס באמצעות phpMyAdmin.

בדיקה האם קיים Gravatar עבור משתמש לפי אימייל או ID

הפונקציה הבאה יבדוק האם קיים גראבאטר (Gravatar) עבור אימייל או ID של משתמש כלשהו בוורדפרס ותחזיר משתנה בוליאני (boolean). הוסיפו קוד זה לקובץ functions.php בתבנית שלכם:

/**
 * Utility function to check if a gravatar exists for a given email or id
 * @param int|string|object $id_or_email A user ID,  email address, or comment object
 * @return bool if the gravatar exists or not
 */

function validate_gravatar($id_or_email) {
	//id or email code borrowed from wp-includes/pluggable.php
	$email = '';
	if ( is_numeric($id_or_email) ) {
		$id = (int) $id_or_email;
		$user = get_userdata($id);
		if ( $user )
			$email = $user->user_email;
	} elseif ( is_object($id_or_email) ) {
		// No avatar for pingbacks or trackbacks
		$allowed_comment_types = apply_filters( 'get_avatar_comment_types', array( 'comment' ) );
		if ( ! empty( $id_or_email->comment_type ) && ! in_array( $id_or_email->comment_type, (array) $allowed_comment_types ) )
			return false;

		if ( !empty($id_or_email->user_id) ) {
			$id = (int) $id_or_email->user_id;
			$user = get_userdata($id);
			if ( $user)
				$email = $user->user_email;
		} elseif ( !empty($id_or_email->comment_author_email) ) {
			$email = $id_or_email->comment_author_email;
		}
	} else {
		$email = $id_or_email;
	}

	$hashkey = md5(strtolower(trim($email)));
	$uri = 'http://www.gravatar.com/avatar/' . $hashkey . '?d=404';

	$data = wp_cache_get($hashkey);
	if (false === $data) {
		$response = wp_remote_head($uri);
		if( is_wp_error($response) ) {
			$data = 'not200';
		} else {
			$data = $response['response']['code'];
		}
		wp_cache_set($hashkey, $data, $group = 'has_gravatar', $expire = 60*5);

	}
	if ($data == '200'){
		return true;
	} else {
		return false;
	}
}

השימוש בפונקציה מתבצע בצורה הבאה:

$author_id = get_the_author_meta( 'ID' );

if (validate_gravatar($author_id)) {...}
	

שליחת אימייל כשמפורסם פוסט חדש באתר וורדפרס

הנה סניפט קצר שמאפשר לשלוח אימייל כאשר אתם מפרסמים פוסט חדש בבלוג שלכם. קוד זה יכול לעבוד גם עבור סוגי תוכן מותאמים (Custom Post Types).

add_action('future_to_publish', 'send_emails_on_new_event');
add_action('new_to_publish', 'send_emails_on_new_event');
add_action('draft_to_publish' ,'send_emails_on_new_event');
add_action('auto-draft_to_publish' ,'send_emails_on_new_event');
 
 
/**
 * Send emails on event publication
 *
 * @param WP_Post $post
 */
function send_emails_on_new_event($post)
{
    $emails = "email_1@mail.com, email_2@mail.com"; //If you want to send to site administrator, use $emails = get_option('admin_email');
    $title = wp_strip_all_tags(get_the_title($post->ID));
    $url = get_permalink($post->ID);
    $message = "Link to post: \n{$url}";
 
    wp_mail($emails, "New post published: {$title}", $message);
}

התוצאה תהיה משהו בסגנון הבא:

[Title] New post published: Your Post
    
Link to post:
http://site.co.il/your-post/

אם אתם רוצים לאפשר זאת עבור סוג תוכן מותאם כלשהו, תוכלו להוסיף תנאי בתוך הפונקציה כבדוגמה הבאה:

...
if(get_post_type($post->ID) === 'page') //post, page, attachment or whatever other CPT you may have
{
    //use wp_mail() here!
}
...

הפנייה לדף הבית לאחר ניתוק מהמערכת

כאשר משתמש מתנתק מהמערכת, ההתנהגות הדיפולטיבית של וורדפרס היא לשלוח את המשתמש חזרה לעמוד ההתחברות (wp-login.php). אך בהרבה מצבים יהיה נכון יותר לשלול את המשתמש חזרה לעמוד הבית של האתר. הנה סניפט שמאפשר לעשות זאת:

add_action('wp_logout', function()
{
    wp_redirect(get_home_url());
    exit;
});

הוספת User Role ל Body Class בממשק הניהול

הנה דרך להוספת Class לפי תפקיד המשתמש בממשק הניהול של וורדפרס. הוסיפו את הקוד הבא לקובץ functions.php בתבנית שלכם:

add_filter('admin_body_class', function($classes) {
    global $current_user;
 
    if(is_array($current_user->roles)) {
        foreach($current_user->roles as $role) {
            $classes .= "user-role-{$role} ";
        }
    }
 
    return rtrim($classes);
});

התוצאה תהיה משהו בסגנון של:

<body class="... user-role-administrator ...">

שינוי סדר התפריט בלוח הבקרה של וורדפרס

סניפט קצר שמאפשר לשנות את הסדר של התפריט בלוח הבקרה של וורדפרס. פשוט בחרו את הסדר שאתם רוצים במערך $reordered_items. אתם יכולים להשתמש ב var_dump($menu_order) בכדי למצוא את כל הפריטים בתפריט.

הפריטים יופיע תחת הפריט העליון ביותר (לוח הבקרה / Dashboard).

add_filter('menu_order', 'reorder_admin_menu', 999);
 
/**
 * Reorders admin menu to match the wanted order
 *
 * @param $menu_order
 * @return mixed
 */
function reorder_admin_menu($menu_order) {
 
  //Example. Puts "Pages" above "Posts".
  $reordered_items = array(
    'edit.php?post_type=page',
    'edit.php'
  );
 
  //This is where we will insert our reordered items
  $reordered_items_insertion_point = 'index.php';
 
  //Remove items we are supposed to reorder
  $filtered_menu_order = array_diff($menu_order, $reordered_items);
 
  //Init new order
  $new_menu_order = array();
 
  //Loop all current menu items
  foreach($filtered_menu_order as $menu_item) {
 
    //Add to array
    $new_menu_order[] = $menu_item;
 
    //Our trigger? Let's go!
    if($menu_item === $reordered_items_insertion_point) {
 
      //Add in our reordered items
      $new_menu_order = array_merge($new_menu_order, $reordered_items);
    }
  }
 
  return $new_menu_order;
}

הוספת CSS לעורך הויזואלי של Advanced Custom Fields

דוגמה להוספת קובץ CSS מהתבנית שלכם לעורך הויזואלי (WYSIWYG) של התוסף Advanced Custom Fields. הקוד מטה יעבוד גם ב Frontend במידה ואתם משתמשים בפונקציה ()acf_forms.


$content_css = get_stylesheet_directory_uri() . '/your-custom-css.css';
 
  if (isset($mce_init[ 'content_css' ])) {
    $mce_init[ 'content_css' ] = "{$mce_init['content_css']},{$content_css}";
  }
 
  return $mce_init;
});
    
add_filter( 'tiny_mce_before_init', function($mce_init) {

איך להוסיף מדינה חדשה ברשימת המדינות בווקומרס

הסניפט הבא נלקח מהדוקומנטציה של ווקומרס ועושה בדיוק מה שאתם חושבים. הוסיפו סניפט זה לקובץ functions.php בכדי להוסיף מדינה חדשה לרשימת המדינות בווקומרס.

function woo_add_my_country( $country ) {
   $country["AE-DU"] = 'Dubai';
   return $country;
}
add_filter( 'woocommerce_countries', 'woo_add_my_country', 10, 1 );

מודיפיקציה לתגית ה title בעמודים ממוספרים (Pagination)

אם תתנו מבט בקוד המקור של העמודים הממוספרים (pagination) בבלוג שלכם, תגלו כי לכולם אותה תגית title. מכיוון ואנו רוצים להמנע מתגיות <title כפולות נכון יהיה להוסיף את מספר העמוד בסוף התגית. ניתן לבצע זאת (בהנחה ואתם משתמשים בתוסף WordPress SEO by Yoast) על ידי הוספת הקוד הבא לקובץ functions.php:

function change_yoast_title($title) {
	$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
	if ( is_paged() ) {
		return $title . ' - עמוד ' . $paged;
	}
	else {
		// first page of pagination
		return $title;
	}
}
add_filter('wpseo_title','change_yoast_title');