Tüm Araçlar
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al
wmaraci reklam

Wordpress Tema Sidebar Özelleştirme

 13 Mesajlar 3.598 Okunma
pst.net
wmaraci reklam

#1
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)
Merhaba arkadaşlar,

Kendi kişisel sitem için bir tema tasarladım ve bunu wordpress yapısına uyarlıyorum, birçok şeyini sorunsuz bir şekilde yaptım, tek tek yapıyorum ancak takıldığım ve neredeyse sıfıra yakın, düzgün bir kaynak ile anlatımını bulamadığım bir sorunum mevcut.

Dinamik bir sidebar oluşturdum, WP Admin panelinden bileşen kısmından widgetleri sorunsuz bir şekilde ekleyebiliyorum. Ancak orada ki widgetler standart tasarıma göre ekleniyor ben onlar üzerinde değiştirmeler yapamıyorum ve bu değiştirmeleri nasıl yapacağıma dair bir anlatım ne resmi codex sayfasında ne yabancı, yerli kaynaklarda mevcut. (var ise yapıştırın linki yoruma)

Standart hali;



Dinamik bir şekilde widgets kısmından yine ekleyeceğim fakat standart tasarımın üzerinde css,js oynamaları yapabileceğim bunu sağladığımda tasarımın şu şekilde oturmasını istiyorum.



Bu sadece kategoriler için örnekleme, diğer bileşenler içinde benim customization yapabilmemi sağlayan bir yapı var mıdır? bir functions.php yardımı ile ya da başka dosya ile bu mümkün mü?

Yoksa statik sidebar yapıp, sidebar.php içerisinde loop'a sokup, oradan statik bir şekilde manuel olarak mı yapmak gerekiyor?
 

 

wptreni.com |  Wordpress Blogu
wmaraci
reklam

#2
hyppia hyppia Web - SEO - Reklam Kullanıcı
  • Üyelik 17.09.2014
  • Yaş/Cinsiyet 35 / E
  • Meslek Mühendis
  • Konum Sakarya
  • Ad Soyad S** G**
  • Mesajlar 316
  • Beğeniler 89 / 88
  • Ticaret 21, (%100)


if ( function_exists('register_sidebar') ) {
register_sidebar(array(
'name' => 'Sağ Sidebar',
'id' => 'sidebarsag',
'description' => 'Sağ sidebar',
'before_widget' => '
',
'after_widget' => '
',
'before_title' => '',
'after_title' => '',
));
}



dinamik sidebar için functions.php içine şuna benzer bir kod eklemişsindir muhtemelen.

before_widget ve after_widget taglerinin karşısına sana uygun olan ara kodları girmelisin.
Machine

kişi bu mesajı beğendi.

#3
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)

hyppia adlı üyeden alıntı



if ( function_exists('register_sidebar') ) {
register_sidebar(array(
'name' => 'Sağ Sidebar',
'id' => 'sidebarsag',
'description' => 'Sağ sidebar',
'before_widget' => '
',
'after_widget' => '
',
'before_title' => '',
'after_title' => '',
));
}



dinamik sidebar için functions.php içine şuna benzer bir kod eklemişsindir muhtemelen.

before_widget ve after_widget taglerinin karşısına sana uygun olan ara kodları girmelisin.



Bunda sıkıntım yok hocam, zaten sidebarı konumlandırmak ve sidebar başlıkları için css classlarımı bu kod ile yapılandırdım benim sorunum şu; Bu sidebar bileşenlerinin içinde ki yapıya müdahale edemiyorum ve standart bir şekilde geliyor ve css ile özel tasarlama yapamıyorum genel yapıyı etkiliyor bunlar.

Misal birinci resimde ki kategoriler ve son yazılar kısmının kullandığı html elementleri

  • ben bunlara özel css tagı ekleyemiyorum, css tagı ekleyebilsem ona göre tasarım yapabilirim ancak buna izin vermiyor ve bunu nasıl yapabileceğime dair bir anlatım yok ne yazık yabancı ve yerli kaynaklarda bulamadım.
 

 

wptreni.com |  Wordpress Blogu

#4
hyppia hyppia Web - SEO - Reklam Kullanıcı
  • Üyelik 17.09.2014
  • Yaş/Cinsiyet 35 / E
  • Meslek Mühendis
  • Konum Sakarya
  • Ad Soyad S** G**
  • Mesajlar 316
  • Beğeniler 89 / 88
  • Ticaret 21, (%100)
hocam link ekleyebilirsen css'e bir de ben bakmak isterim
 

 

wmaraci
Mersin evden eve nakliyat

#5
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)

hyppia adlı üyeden alıntı

hocam link ekleyebilirsen css'e bir de ben bakmak isterim


CSS link eklemek derken hocam? css'lik bir sorun yok ben anlatmak istediğimi tam olarak anlatamadım sanırım şöyle açıklamaya çalışayım kodlamayı.

Standart olarak wordpress'de kategori listeleme bileşeninde
  • yapısı kullanılıyor ve bu kodlara extra bir css classı ekleyemiyorum.



    • Direkt
      • yapısına css uygular isem örneğin yazı içerisinde listelemelerde bozuluyor. Sitenin genelinde kullanılan bir ul li yapısı olduğu için.

        Benim de bulmak istediğim şey şu ben bu standart yapıya müdahale yapabilir miyim? kendi özel yapımı uygulayabilir miyim?

        Standart yapı;




        Kullanmak istediğim, oluşturmak istediğim kodlama yapısı.



        Dinamik sidebar'da bunu sağlayabilir miyim? wordpressin temel bileşenler için kullandığı html yapısına, css yapısını kendime göre değiştirebilir miyim? bununla ilgili döküman arıyorum kısacası

        Not: localhost'ta çalıştığım için herhangi bir canlı önizleme sunma imkanım yok tasarım ile ile ilgili.
 

 

wptreni.com |  Wordpress Blogu

#6
hyppia hyppia Web - SEO - Reklam Kullanıcı
  • Üyelik 17.09.2014
  • Yaş/Cinsiyet 35 / E
  • Meslek Mühendis
  • Konum Sakarya
  • Ad Soyad S** G**
  • Mesajlar 316
  • Beğeniler 89 / 88
  • Ticaret 21, (%100)
burada sanırım sorunun cevabı var


ayrıca bunu hiç değiştirmeden

temanın css kodunda şu yolu izleyerek istediğin görünümü sağlayabilirsin.

.card .card-content ul{
// bu kısma kendi özel değerlerini girebilirsin.
}

.card .card-content ul li{
// bu kısma kendi özel değerlerini girebilirsin.
}

 

 

#7
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)

hyppia adlı üyeden alıntı

burada sanırım sorunun cevabı var


ayrıca bunu hiç değiştirmeden

temanın css kodunda şu yolu izleyerek istediğin görünümü sağlayabilirsin.

.card .card-content ul{
// bu kısma kendi özel değerlerini girebilirsin.
}

.card .card-content ul li{
// bu kısma kendi özel değerlerini girebilirsin.
}



Merhaba,

Verdiğiniz kaynakta ki işlem ne yazık ki dinamik sidebar'da tam olarak çalışmıyor ya da eski wordpress yapısına ait bir kaynak.

CSS olayı da ne yazık ki işlemiyor hocam. Bu konuda bilgi sahibi olan arkadaşlar yardımcı olurlarsa çok sevinirim. Bi' aydınlatın beni :S
 

 

wptreni.com |  Wordpress Blogu

#8
wpuzman wpuzman WordPress Developer Kullanıcı
  • Üyelik 13.01.2017
  • Yaş/Cinsiyet 32 / E
  • Meslek Yazılım
  • Konum Trabzon
  • Ad Soyad B** M**
  • Mesajlar 2773
  • Beğeniler 293 / 949
  • Ticaret 33, (%100)
Her widget türünün kendine özgü class ı vardır. Direk ul ve li ye css eklersen bu bütün siteti etkiler. Yapman gereken ana div classlarını kullanmak. Örneğin;
.widget_categories ul li {
list-style-type: none;
}
 

 

Udemy Wordpress Tema Yapımı Kursum

#9
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)

bilimokur adlı üyeden alıntı

Her widget türünün kendine özgü class ı vardır. Direk ul ve li ye css eklersen bu bütün siteti etkiler. Yapman gereken ana div classlarını kullanmak. Örneğin;
.widget_categories ul li {
list-style-type: none;
}


Hocam onu bende biliyorum ancak istediğim şekilde düzenleme yapamıyorum.

Misal, kategorileri ul li yapısında düzenledim fakat kategori içerisinde yazı sayısı için ekstra bir css classı ekleyemiyorum.

Şuan default css classlarını kullanarak düzenleme yaptım;



Resimde gördüğün gibi sıkıntı yok ancak ben o kategori içinde ki yazı sayısını gösteren (1) vs yazan kısımları düzenleyemiyorum.

Eğer oraları düzenleyebilsem, oluşturmak istediğim şekil aşağıda ki görsel gibi olacak;



Tabii işin içine birkaç javascript'te giriyor, tooltip özelliği vs de eklemek istiyorum tasarıma.

Bulduğum tüm anlatımlar hepsi eski anlatımlar 2010-2011 yılları için geçerli anlatımlar ve paylaşılan kodlar, yapıların sadece belli bir kısmı çalışıyor diğerleri değişmiş. Güncel, yeni yapıya yönelik bir anlatım mevcut değil ne yazık ki.
 

 

wptreni.com |  Wordpress Blogu

#10
Machine Machine www.wptreni.com Kullanıcı
  • Üyelik 24.08.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Bilgisayar Programcılığı & FED
  • Konum Aksaray
  • Ad Soyad H** K**
  • Mesajlar 1039
  • Beğeniler 73 / 327
  • Ticaret 12, (%100)
@bilimokur @hyppia Tamamdır arkadaşlar, kendim deneme yanılma yaparak sorunumu çözdüm. Çözüm, aşağıda ki kodu temanızın functions.php dosyasına eklemeniz gerekiyor, temanıza özel widget oluşturmuş oluyorsunuz, temel wordpress kategori bileşenini değil kendi bileşeninizi kullanarak oluşturabilirsiniz.


class Huseyinkorbalta_Kategori_Widget extends WP_Widget{
function __construct() {
parent::__construct(
'hk_kategori_widget', // Widget'in ID kısmı
'Sidebar Kategori', // Widget'in adı
array('description' => __( 'Sidebar kısmında özel kategori tasarımını gösterebileceğiniz widget'))
);
}
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
//$instance['post_type'] = strip_tags($new_instance['post_type']);
//$instance['numberOfListings'] = strip_tags($new_instance['numberOfListings']);
return $instance;
}
function form($instance) {
if( $instance) {
$title = esc_attr($instance['title']);
} else {
$title = '';
}
?>






}
function widget($args, $instance) {
extract( $args );
$title = apply_filters('widget_title', $instance['title']);

echo $before_widget;
if ( $title ) {
echo $before_title . $title . $after_title;
}
$this->getMostViewedListings();
echo $after_widget;
}
function getMostViewedListings() { //html
$args = array(
'type' => 'post'
);
$categories = get_categories($args);
//echo "
";var_dump($categories);echo "
";
if($categories){
echo "";
}
}


} //end class

register_widget('Huseyinkorbalta_Kategori_Widget');
?>

Gerekli css, div, ul li vb yerleri kendinize göre düzenleyin. Ayrıca /kategori/ yazna kısım url ayarı kısmıdır. Kendi site yapınıza göre o kısmı düzenlersiniz.
 

 

wptreni.com |  Wordpress Blogu
iki temayı karşılaştırır mısınız ?
Yoast Seo - Bir Türlü Çözemedim
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
 
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al