0
Kayıt Ol

Generate Press Güzelleştirme Serisi #6 ✅ H2 ve H3 Tagları

15

●

878

  • 13-09-2022, 00:03:36
    #10
    Linux
    Linux
    iyisite.NET
    Gelistirici adlı üyeden alıntı: mesajı görüntüle
    İçeriğinizdeki başlıklar h2 yada h3 olmayabilir bunu kontrol edin.
    Direkt içeriğinizde bir başlıkta olmayabilir h1 dışında veyahut başlık olarak gözükse de bold olarak belirlenmiş olabilirler.
    Ayrıca CSS kodlarınız hata veriyor bir yerinde hata yapılmış bütün kod yapısını bozmuş
    h2 ve h3 hocam, yazıları ben yazıyorum.
  • 19-09-2022, 22:55:14
    #11
    Gelistirici
    Gelistirici
    En iyisi sanırım
    Sorununuzu düzelttik :)
  • 10-01-2024, 09:40:11
    #12
    erhanyavuz
    erhanyavuz
    Gelistirici adlı üyeden alıntı: mesajı görüntüle
    Günümüzün popüler temalarından Generate Press aşırı hızlı olmasına rağmen aşırı sade bir yapıya sahip.
    Tabii ki bu temayı da güzelleştirmenin (hızdan kesmeden) yolları mevcut.

    Sizlerle başladığımız bu seride 6. bölüme geldik. Sizlerle beraber bu temayı baştan sona kadar güzelleştirmeyi hedefliyoruz
    Bakalım yolun sonu nereye gidiyor...

    Bu bölümde sizlere h2 ve h3 taglarını düzenlemeyi göstereceğim.
    Çok ciks bir tasarım çıktı ortaya bana göre.

    Klasiğimizle devam edelim.

    Before:



    After :



    Sizleri bekletmeden nasıl yapılacağına geçelim.

    Görünüm > Özelleştir > Ek CSS bölümüne geliyoruz.
    Daha sonra ilgili alana aşağıdaki kodları ekliyoruz.

        /* H2 - H3 */
    .entry-content h2,h3{
        padding: 10px 10px 10px 25px;
        background-image: linear-gradient(to bottom left, #553c9a, #ee4b2b);
        text-shadow: 0px 4px 10px rgba(179, 147, 211, 0.5);
        border-radius:50px;
        color:white!important;
    }
    .entry-content h3{
        padding: 7px 7px 7px 25px;
    }
    Sonrasında yayımlamamız yeterlidir.
    Hayırlı olsun

    Farklı renk kombinasyonlarımız da var sizin için hazırladığım ancak kendi renginizi belirlemek isterseniz:

    background-image: linear-gradient(to bottom left, #553c9a, #ee4b2b);

    Bu satırda bulunan 553c9a ve ee4b2b değerlerini değiştirmeniz yeterlidir.

    Kırmızı - Sarı

    background-image: linear-gradient(to bottom left, #e6e600, #e60000);


    Su Yeşili - Mavi

    background-image: linear-gradient(to bottom left, #00e600, #00a3cc);


    Lacivert - Mor

    background-image: linear-gradient(to bottom left, #d24dff, #2e2eb8);


    Umuyorum beğenmişsinizdir güzel bir tasarım oldu bana kalırsa

    Gelecek bölümlerde sizin özellikle istediğiniz şurayı da güzelleştirelim, düzenleyelim dediğiniz yerler de var ise yorumlarda belirtebilirsiniz.
    Şuanki aklımda bulunan yerlerin planına göre en az 10 bölüme tamamlamış olacağız sizlerin istekleriyle bunu arttırabiliriz

    Serinin diğer içerikleri:
    - FAQ Bölümü Rank Math
    - Entry Meta - Yazar ve İçerik Metası
    - İçerik & Makale Gölgesi
    - Alıntılar
    - Navigasyon Barı

    Şuradan da asıl içeriğe erişebilirsiniz: GeneratePress Teması Nasıl Özelleştirilir?

    İyi forumlar dilerim esen kalın
    Verdiğiniz kod güzel oldu öncelikle teşekkür ederim. Sorum şu ki:

    Bu kodu eklediğimde ana sayfada tasarımında kullandığım başlıklarda gradyantlı oluyor ve tasarım bozuluyor. Bunu sadece yazı sayfalarında gösterebilmenin bildiğiniz bir yolu var mı?
  • 11-02-2024, 20:02:14
    #13
    Tsubaki
    Tsubaki
    Gelistirici adlı üyeden alıntı: mesajı görüntüle
    Günümüzün popüler temalarından Generate Press aşırı hızlı olmasına rağmen aşırı sade bir yapıya sahip.
    Tabii ki bu temayı da güzelleştirmenin (hızdan kesmeden) yolları mevcut.

    Sizlerle başladığımız bu seride 6. bölüme geldik. Sizlerle beraber bu temayı baştan sona kadar güzelleştirmeyi hedefliyoruz
    Bakalım yolun sonu nereye gidiyor...

    Bu bölümde sizlere h2 ve h3 taglarını düzenlemeyi göstereceğim.
    Çok ciks bir tasarım çıktı ortaya bana göre.

    Klasiğimizle devam edelim.

    Before:



    After :



    Sizleri bekletmeden nasıl yapılacağına geçelim.

    Görünüm > Özelleştir > Ek CSS bölümüne geliyoruz.
    Daha sonra ilgili alana aşağıdaki kodları ekliyoruz.

        /* H2 - H3 */
    .entry-content h2,h3{
        padding: 10px 10px 10px 25px;
        background-image: linear-gradient(to bottom left, #553c9a, #ee4b2b);
        text-shadow: 0px 4px 10px rgba(179, 147, 211, 0.5);
        border-radius:50px;
        color:white!important;
    }
    .entry-content h3{
        padding: 7px 7px 7px 25px;
    }
    Sonrasında yayımlamamız yeterlidir.
    Hayırlı olsun

    Farklı renk kombinasyonlarımız da var sizin için hazırladığım ancak kendi renginizi belirlemek isterseniz:

    background-image: linear-gradient(to bottom left, #553c9a, #ee4b2b);

    Bu satırda bulunan 553c9a ve ee4b2b değerlerini değiştirmeniz yeterlidir.

    Kırmızı - Sarı

    background-image: linear-gradient(to bottom left, #e6e600, #e60000);


    Su Yeşili - Mavi

    background-image: linear-gradient(to bottom left, #00e600, #00a3cc);


    Lacivert - Mor

    background-image: linear-gradient(to bottom left, #d24dff, #2e2eb8);


    Umuyorum beğenmişsinizdir güzel bir tasarım oldu bana kalırsa

    Gelecek bölümlerde sizin özellikle istediğiniz şurayı da güzelleştirelim, düzenleyelim dediğiniz yerler de var ise yorumlarda belirtebilirsiniz.
    Şuanki aklımda bulunan yerlerin planına göre en az 10 bölüme tamamlamış olacağız sizlerin istekleriyle bunu arttırabiliriz

    Serinin diğer içerikleri:
    - FAQ Bölümü Rank Math
    - Entry Meta - Yazar ve İçerik Metası
    - İçerik & Makale Gölgesi
    - Alıntılar
    - Navigasyon Barı

    Şuradan da asıl içeriğe erişebilirsiniz: GeneratePress Teması Nasıl Özelleştirilir?

    İyi forumlar dilerim esen kalın
    hocam bu kodu farklı bir tema için ekledim çalıştı ama anasayfadaki son eklenen içeriklerin başlık kısımları da böyle oldu. Anasayfada görüntülenenleri harç tutabilecek bir kod eklemesi olabilir mi acaba? Yani sadece yazı içindeki başlıkları bu hale getirebilecek şekilde nasıl yaparız kodu
  • 11-02-2024, 20:15:32
    #14
    Onur89TR
    Onur89TR
    .entry-content h2,h3{

    bu satır,

    .entry-content h2,.entry-content h3{

    şeklinde değiştirilebilir Paylaşım için teşekkürler
  • 11-02-2024, 20:19:08
    #15
    Tsubaki
    Tsubaki
    Onur89TR adlı üyeden alıntı: mesajı görüntüle
    .entry-content h2,h3{

    bu satır,

    .entry-content h2,.entry-content h3{

    şeklinde değiştirilebilir Paylaşım için teşekkürler
    eyw hocam tam konu açacaktım nasıl yaparız diye, bildirim geldi. Çok teşekkür ederim
  • 11-02-2024, 21:34:46
    #16
    Gelistirici
    Gelistirici
    En iyisi sanırım
    Onur89TR adlı üyeden alıntı: mesajı görüntüle
    .entry-content h2,h3{

    bu satır,

    .entry-content h2,.entry-content h3{

    şeklinde değiştirilebilir Paylaşım için teşekkürler
    Ben teşekkür ederim eklemeniz için.