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

ישנם מספר סיטואציות בהן תקבלו את השגיאה HTTP Error כשאתם מנסים להעלות תמונות לספריית המדיה באתר וורדפרס:

• שם קובץ בעייתי (סימנים מיוחדים וכדומה).
• משקל הקובץ הוא מעבר למה שהשרת מאפשר (upload_max_size).
• זכרון PHP בשרת אינו מספיק.
• אין מספיק שטח אחסון בשרת.

שגיאת HTTP בספריית המדיה של וורדפרס.

אז בתור התחלה בדקו את שם הקובץ ונסו להקטין את משקל הקובץ. בכדי להגדיל את הזיכרון הוסיפו את הקוד הבא לקובץ wp-config.php הנמצא בתיקייה הראשית של האתר:

define( 'WP_MEMORY_LIMIT', '256M' );

ניתן גם לעשות זאת דרך קובץ .htaccess, אך במידה וחברת האחסון שלכם חוסמת אפשרות זו תקבלו שגיאה 500 אז שימו לב ואל תבצעו בדרך זו אם זה המצב (פשוט מחקו את השורה).

php_value memory_limit 256M

אם יש לכם גישה לקובץ php.ini אז ניתן לעשות זאת על ידי הקוד הבא:

memory_limit = 256M

במצבים מסויימים גם ModSecurity בשרת יכול למנוע מכם להעלות קבצים. ניתן לבטל אותו דרך cPanel או לנסות את השורות הבאות בקובץ .htaccess (בטלו אם מופיעה שגיאה). נציין כי ישנה סיבה טובה ש ModSecurity קיים לטובת אבטחת אתר הוורדפרס שלכם:

SecFilterEngine Off 
SecFilterScanPOST Off 

הקובץ gitignore מסמן ל Git לא לעקוב (track) אחר קבצים מסויימים בפרוייקט. אם מדברים על וורדפרס, הנה קובץ gitignore מומלץ שניתן לשנות בהתאם לצורך הפרוייקט שלכם:

# -----------------------------------------------------------------
# .gitignore for WordPress
# -----------------------------------------------------------------

# ignore everything in the root except the "wp-content" directory.
/*
!wp-content/

# ignore all files starting with .
.*

# track this file .gitignore (i.e. do NOT ignore it)
!.gitignore

# track .editorconfig file (i.e. do NOT ignore it)
!.editorconfig

# track readme.md in the root (i.e. do NOT ignore it)
!readme.md

# ignore all files that start with ~
~*

# ignore OS generated files
ehthumbs.db
Thumbs.db

# ignore Editor files
*.sublime-project
*.sublime-workspace
*.komodoproject

# ignore log files and databases
*.log
*.sql
*.sqlite

# ignore compiled files
*.com
*.class
*.dll
*.exe
*.o
*.so

# ignore packaged files
*.7z
*.dmg
*.gz
*.iso
*.jar
*.rar
*.tar
*.zip

# ignore everything in the "wp-content" directory, except:
# "mu-plugins" directory
# "plugins" directory
# "themes" directory
wp-content/*
!wp-content/mu-plugins/
!wp-content/plugins/
!wp-content/themes/

# ignore these plugins from the core
wp-content/plugins/hello.php
wp-content/plugins/akismet/

# ignore specific themes
wp-content/themes/twenty*/

# ignore node/grunt dependency directories
node_modules/

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

ווקומרס בגירסה 3.0+

/**
 * Show product weight on archive pages
 */
add_action( 'woocommerce_after_shop_loop_item', 'savvy_show_weights', 9 );

function savvy_show_weights() {

    global $product;
    $weight = $product->get_weight();

    if ( $product->has_weight() ) {
        echo '<div class="product-meta"><span class="product-meta-label">Weight: </span>' . $weight . get_option('woocommerce_weight_unit') . '</div></br>';
    }
}

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

ווקומרס בגירסה 3.0+

/**
 * Show product dimensions on archive pages for WC 3+
 */
add_action( 'woocommerce_after_shop_loop_item', 'savvy_show_dimensions', 9 );

function savvy_show_dimensions() {
    global $product;
    $dimensions = wc_format_dimensions($product->get_dimensions(false));

        if ( $product->has_dimensions() ) {
                echo '<div class="product-meta"><span class="product-meta-label">Dimensions: </span>' . $dimensions . '</div>';
        }
}

ווקומרס בגירסה נמוכה מ 3.0

/**
 * Show product dimensions on archive pages WC 3 and below
 */
add_action( 'woocommerce_after_shop_loop_item_title', 'wc_show_dimensions', 9 );

function wc_show_dimensions() {
	global $product;
	$dimensions = $product->get_dimensions();

        if ( ! empty( $dimensions ) ) {
                echo '<span class="dimensions">' . $dimensions . '</span>';
        }
}

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

/**
 * Automatically add product to cart on visit
 */
add_action( 'template_redirect', 'add_product_to_cart' );
function add_product_to_cart() {
	if ( ! is_admin() ) {
		$product_id = 64; //replace with your own product id
		$found = false;
		//check if product already in cart
		if ( sizeof( WC()->cart->get_cart() ) > 0 ) {
			foreach ( WC()->cart->get_cart() as $cart_item_key => $values ) {
				$_product = $values['data'];
				if ( $_product->get_id() == $product_id )
					$found = true;
			}
			// if product not found, add it
			if ( ! $found )
				WC()->cart->add_to_cart( $product_id );
		} else {
			// if no products in cart, add it
			WC()->cart->add_to_cart( $product_id );
		}
	}
}

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

/**
 * Add another product depending on the cart total
 */
add_action( 'template_redirect', 'add_product_to_cart' );
function add_product_to_cart() {
  if ( ! is_admin() ) {
		global $woocommerce;
		$product_id = 2831; //replace with your product id
		$found = false;
		$cart_total = 30; //replace with your cart total needed to add above item

		if( $woocommerce->cart->total >= $cart_total ) {
			//check if product already in cart
			if ( sizeof( $woocommerce->cart->get_cart() ) > 0 ) {
				foreach ( $woocommerce->cart->get_cart() as $cart_item_key => $values ) {
					$_product = $values['data'];
					if ( $_product->get_id() == $product_id )
						$found = true;
				}
				// if product not found, add it
				if ( ! $found )
					$woocommerce->cart->add_to_cart( $product_id );
			} else {
				// if no products in cart, add it
				$woocommerce->cart->add_to_cart( $product_id );
			}
		}
	}
}

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

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

/**
 * Send an email each time an order with coupon(s) is completed
 * The email contains coupon(s) used during checkout process
 *
 */ 
function woo_email_order_coupons( $order_id ) {
        $order = new WC_Order( $order_id );
        
        if( $order->get_used_coupons() ) {
        
          $to = 'youremail@yourcompany.com';
	        $subject = 'New Order Completed';
	        $headers = 'From: My Name <youremail@yourcompany.com>' . "\r\n";
	        
	        $message = 'A new order has been completed.\n';
	        $message .= 'Order ID: '.$order_id.'\n';
	        $message .= 'Coupons used:\n';
	        
	        foreach( $order->get_used_coupons() as $coupon) {
		        $message .= $coupon.'\n';
	        }
	        @wp_mail( $to, $subject, $message, $headers );
        }
}
add_action( 'woocommerce_thankyou', 'woo_email_order_coupons' );}

הסניפט הבא יסיר את תמונות המוצר בעמודי המוצר עצמו (Single Product Pages) רק עבור מוצרים הנמצאים בקטגוריה ״Music״.

/**
 * Remove product content based on category
 */
add_action( 'wp', 'remove_product_content' );
function remove_product_content() {
    // If a product in the 'Cookware' category is being viewed...
    if ( is_product() && has_term( 'Music', 'product_cat' ) ) {
        //... Remove the images
        remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 );
        // For a full list of what can be removed please see woocommerce-hooks.php
    }
}

הסניפט הבא יאפשר לכם להוסיף קוד מעקב או קוד אנליטיקס כלשהו לעמוד התודה של ווקומרס (Thank you page). בקוד תמצאו משתנים בהם אתם יכולים להשתמש כמו סכום המכירה שבוצעה, המוצרים שנמכרו ועוד.

/**
 * Add custom tracking code to the thank-you page
 */
add_action( 'woocommerce_thankyou', 'my_custom_tracking' );

function my_custom_tracking( $order_id ) {

	// Lets grab the order
	$order = wc_get_order( $order_id );

	/**
	 * Put your tracking code here
	 * You can get the order total etc e.g. $order->get_total();
	 */
	 
	// This is the order total
	$order->get_total();
 
	// This is how to grab line items from the order 
	$line_items = $order->get_items();

	// This loops over line items
	foreach ( $line_items as $item ) {
  		// This will be a product
  		$product = $order->get_product_from_item( $item );
  
  		// This is the products SKU
		$sku = $product->get_sku();
		
		// This is the qty purchased
		$qty = $item['qty'];
		
		// Line item total cost including taxes and rounded
		$total = $order->get_line_total( $item, true, true );
		
		// Line item subtotal (before discounts)
		$subtotal = $order->get_line_subtotal( $item, true, true );
	}
}

סניפט קצר בו אני משתמש רבות כשאני נדרש לבצע גלילה לאלמנט מסויים (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 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');

התגובות בוורדפרס מגיעות כברירת מחדל עם שדה בשם ״אתר״ (באנגלית שמו 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');

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

function maintenace_mode() {

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

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

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