תמונת פוסט ראשית – פונקציה חכמה להטמעה!

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

למה זה חשוב?

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

איך זה עובד?

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

סדר הפעולות בפונקציה

  1. חפש תמונה ראשית
  2. (אם לא מצאת) – חפש את התמונה הראשונה בפוסט
  3. (אם לא מצאת) – השתמש בתמונה ברירת מחדל

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

פרופסור

הפונקציה עם הסברים

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

// הפונקציה המלאה - להטמעה בfunctions.php או בקובץ נלווה
function sagive_get_thhumbnail($postid, $content){

	// ראשית - חפש את תמונת הפוסט הראשית
	$thumb_url = wp_get_attachment_url( get_post_thumbnail_id($postid));

	// אם אין תמונת פוסט ראשית
	if(!$thumb_url) {

		// מצא את התמונה הראשונה בפוסט
		$output 	= preg_match_all('/<img.+src=['"]([^'"]+)['"].*>/i', $content, $matches);
		$thumb_url 	= $matches[1][0];

		// אם אין תמונה בפוסט הבא הבא את תמונת ברירת מחדל
		if(empty($thumb_url)) {
			$thumb_url = 'path/to/default/img.jpg';
		}
	}

	// החזר את התמונה
	return $thumb_url;
}
הפונקציה בלי הערות +
function sagive_get_thhumbnail($postid, $content){

	$thumb_url = wp_get_attachment_url( get_post_thumbnail_id($postid));

	if(!$thumb_url) {
		$output 	= preg_match_all('/<img.+src=['"]([^'"]+)['"].*>/i', $content, $matches);
		$thumb_url 	= $matches[1][0];

		if(empty($thumb_url)) {
			$thumb_url = 'path/to/default/img.jpg';
		}
	}
	return $thumb_url;
}

איך משתמשים בה?

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

לופ של דף קטגוריה לפני שינוי

<h1 class="cat-title"><?php single_cat_title(); ?></h1>
<?php
if(have_posts()) {
	while ( have_posts() ) {
		the_post(); 

		// LOAD SOME CUSTOM OPTIONS
		$pid			=	get_the_ID();
		$plink			=	get_permalink();
		$excerpt		=	get_the_excerpt();
		$thumb_url 		=	wp_get_attachment_url(get_post_thumbnail_id($pid));

		// ECHO STUFF
		echo '
		<div class="single-cat-item bbED pb2 mb2">
			<div class="row">
				<div class="col-md-3">
					<img src="'.$thumb_url.'" alt="'.get_the_title().'"  class="img-responsive img-thumbnail"  />
				</div>
				<div class="col-md-9">
					<h3 class="scat-title"><a href="'.$plink.'">'.get_the_title().'</a></h3>
					<div class="scat-excerpt">'.$excerpt.'</div>
					<div class="mt2"><a href="'.$plink.'" class="cat-rmore btn btn-xs btn-info">Read More <i class="fa fa-arrow-right"></i></a></div>
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
		';
	}
}
?>

לופ של דף קטגוריה לאחר שינוי

<h1 class="cat-title"><?php single_cat_title(); ?></h1>
<?php
if(have_posts()) {
	while ( have_posts() ) {
		the_post(); 

		// LOAD SOME CUSTOM OPTIONS
		$pid			=	get_the_ID();
		$plink			=	get_permalink();
		$excerpt		=	get_the_excerpt();		

		// ECHO STUFF
		echo '
		<div class="single-cat-item bbED pb2 mb2">
			<div class="row">
				<div class="col-md-3">
					<img src="'.sagive_get_thhumbnail($pid, $content).'" alt="'.get_the_title().'"  class="img-responsive img-thumbnail"  />
				</div>
				<div class="col-md-9">
					<h3 class="scat-title"><a href="'.$plink.'">'.get_the_title().'</a></h3>
					<div class="scat-excerpt">'.$excerpt.'</div>
					<div class="mt2"><a href="'.$plink.'" class="cat-rmore btn btn-xs btn-info">Read More <i class="fa fa-arrow-right"></i></a></div>
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
		';
	}
}
?>

מה שינינו?

השורה הזאת:

<img src="'.$thumb_url.'" alt="'.get_the_title().'" class="img-responsive img-thumbnail" />

שונתה לזאת:

<img src="'.sagive_get_thhumbnail($pid, $content).'" alt="'.get_the_title().'"  class="img-responsive img-thumbnail"  />

הפונקציה מבטיחה תמונה ראשית בכל מצב!

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

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

  • אהבתם? שתפו!