Wordpress Öne Çıkarılmış Görsel Boyutu

WordPress anasayfada gösterilen resimlerin ufak büyük olması, sayfa yüklenme zamanı için ve sayfa boyutu için önemlidir.

Sayfanız ziyaretçinin karşısına ne kadar hızlanırsa o kadar iyi. Bu nedenle büyük boyutlu resimlerin olduğu klasik the_content taglı bir index.php sayfasına sahipseniz sitenizin açılış hızı düşecektir.



functions dosyasının en altına ?> kodundan önce satır boşluğu bırakmadan ekleyiniz.

[php]if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 150, 300 );
}[/php]

Single archive veya index sayfasında nerde görmek istorsanız aşağıda kodları kodundan önce ekleyin.

[php]<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
?>[/php]

temanızda CSS kodlarından dolayı bozulmalar olursa

ongersel adında div class atabilirsiniz. örnek,

[php]<div class="ongorseli"><?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
?></div>[/php]


alttaki kodları CSS dosyanızı yedekleyerek en altına ekleyin. CSS Kodları Kullanımı konusundan kodların işlevini takip ederek kısa sürede sorunsuz CSS dosyasına sahip olursunuz. (Not bu dosya width: 160px; height: 200px; göre ayarlanmıştır.)

[php].ongorseli {
margin: 8px 2px 0px 0px;
padding: 0px;
float: left;
position: relative;
vertical-align: middle;
width: 160px;
line-height: 15px;
color: #525252;
}

.ongorseli img {
border: 1px solid #DBDBDB;
margin: 1px 3px 1px 1px;
padding: 3px;
text-align: center;
}
.ongorseli img:hover{
border: 1px solid #666666;
margin: 1px 3px 1px 1px;
padding: 3px;
text-align: center;
}
.ongorseli img a {
padding: 4px 4px 0px 4px;
border: 1px solid #EBEBEB;
}
.ongorseli a {
text-decoration: none;
}

.ongorseli {margin-left: 5px; float: left;
margin-bottom: 16px; padding-right: 13px; padding-top: 5px; margin-top 5px;}[/php]

Kategori: CSS, Öne Çıkarılmış Görsel, WordPress