אתמול כאשר סיימתי לעצב את אחת הכותרות לעיצוב המחודש שלי עלו בראשי עוד מספר רעיונות. הרגשתי שאני צריך לעצב עוד כותרות , אבל דקה, הריי שאני יכול רק כותרת אחת , לא ?!
העלאתי חיפוש בגוגל- How to random kubrick header. עלו לנגד עיניי שתי תוצאות מעניינות:
My Header Works! , Header Graphic
דרך שני התוצאות האלה הבנתי בערך מה עליי לעשות אבל התקשתי ובזבזתי כמה שעות ביצירת קובץ header.php בשביל הצרכים שלי.
לבסוף הגעתי לקובץ הבא, שאת תוכנו אפרסם כאן:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<?php
function header_graphic() {
echo "/images/";
$num=rand(1,5); /* number of pictures here */
echo "kubrickheader".$num.".jpg";
};
?>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!– leave this for stats –>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://feeds.feedburner.com/dev_random" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<link rel="meta" type="application/rdf+xml" title="FOAF" href="http://www.mcdevzone.com/content/foaf.rdf" />
<style type="text/css" media="screen">
/* BEGIN IMAGE CSS */
/* To accomodate differing install paths of WordPress, images are referred only here,
and not in the wp-layout.css file. If you prefer to use only CSS for colors and what
not, then go right ahead and delete the following lines, and the image files. */
body { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbgcolor.jpg"); } <?php /* Checks to see whether it needs a sidebar or not */ if ((! $withcomments) && (! is_single()) && (! is_page())) { ?>
#page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbg-<?php bloginfo('text_direction'); ?>.jpg") repeat-y top; border: none; } <?php } else { // No sidebar ?>
#page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbgwide.jpg") repeat-y top; border: none; } <?php } ?>
#header { background: url("<?php bloginfo('stylesheet_directory'); header_graphic(); ?>") no-repeat bottom center; }
/* #header { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickheader1.jpg") no-repeat bottom center; } */
#footer { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickfooter.jpg") no-repeat bottom; border: none;}
/* Because the template is slightly different, size-wise, with images, this needs to be set here
If you don't want to use the template's images, you can also delete the following two lines. */
#header { margin: 0; padding: 0px; height: 198px; width: 758px; }
#headerimg { margin: 7px 9px 0; height: 192px; width: 740px; }
/* END IMAGE CSS */
/* To ease the insertion of a personal header image, I have done it in such a way,
that you simply drop in an image called 'personalheader.jpg' into your /images/
directory. Dimensions should be at least 760px x 200px. Anything above that will
get cropped off of the image. */
/*
#headerimg { background: url('<?php bloginfo('stylesheet_directory'); ?>/images/personalheader.jpg') no-repeat left;}
*/
</style>
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php wp_head(); ?>
</head>
<body>
<div id="page">
<div id=header>
<a href="<?php echo get_option('home'); ?>"><div id="headerimg"></div></a>
</div>
<hr />
עכשיו , בתחילת הקוד ישנה פונקציית php המגדירה למערכת לבחור תמונה באופן רנדומלי.
על התמונה להיות תחת השם kubrickheaderX.jpg כאשר במקום x נציב מספרים. את כל התמונות נעשה לתקיית ה images שנמצאת בתוך ספריית העיצוב.
וככה בעצם אנחנו גורמים לקובריק להציג כותרות בצורה רנדומלית.
נחמד מאוד. עשיתי F5… F5… F5 וראיתי את רוב התמונות. באיזה תוכנה עיבדת את התמונות?
אני ממליץ שתשים ltr על שדה הקוד בשביל שאפשר יהיה לקרוא אותו.
אריאל, את התמונות ערכתי עם gimp היא ממש פשוטה ונוחה .
תומר, שמתי , משום מה העיצוב לא מציג זאת …
כנראה לא שמת את הקוד הנכון.