Support » Teemat ja mallit » Eri css per kategoria ja tagi kaikilla sivuilla ja osioissa

  • Resolved Elli_K

    (@elli_k)


    Moi!

    Olen tämän kanssa ollut jumissa jo pari päivää, joten vinkit erittäin arvostettuja. Tarve olisi saada eri kategoriat, ja mielellään jopa niihin kuuluvat tagit käyttämään omaa tyyliään. Toistaiseksi olen löytänyt ratkaisuja (vaikken niistäkään ole saanut yhtään vielä kunnolla toimimaan) vain siihen, että yksittäisen kategorian sivulla on eri tyylitiedosto käytössä.

    Käytössä on muokattu Twenty Fourteen, ja tarkoituksena on siis myös etusivulle, jossa karuselli ja x määrä posteja, saada visuaalista erottuvuutta eri aihealueen postien välille css:llä. Eli josko artikkeli kuuluu kategoriaan ’Uutiset’, sen yhteydessä näkyvä kategorian nimi on valkoisella fontilla ja mustalla taustalla, mutta sitten taas kategoriaan ’Leivonnaiset’ kuuluvassa postauksessa kategoria onkin mustalla tekstillä ja punaisella taustalla.

    Täydellisessä maailmassa ulottaisin tämän postausten erottelun väreillä myös mielellään karuselliin, ylänaviin, ja jopa tageihin.

Esillä 9 vastausta, 1 - 9 (kaikkiaan 9)
  • Thread Starter Elli_K

    (@elli_k)

    Ja siis vielä tarkennuksena; niin tässä tapauksessa ei ole vaihtoehtona se, että yksittäiselle postaukselle määrittää erikseen tyylin, koska sisältöä on niin paljon. Eli laskisin tämän enemmän toiminnallisuudeksi, että oli sitten kyseessä etusivu, kategoriasivu, tai hakutulokset, jos kirjoitus on kategoriassa ’Uutiset’ sillä on aina se sama, oma tyyli (visuaalinen erottuvuus).

    Moderator Sami Keijonen

    (@samikeijonen)

    Jokaisessa artikkelissa on kategorian nimi class-arvona ja voit käyttää sitä tyylien erotteluun. Esim.

    category-photos tag-example

    Zekkaa demosta tarkemmin vaikka Chromen developer-työkalulla.

    http://twentyfourteendemo.wordpress.com/

    Esim. etusivun artikkelit ovat muotoa

    <article id="post-344" class="post-344 post type-post status-publish format-standard has-post-thumbnail sticky hentry category-photos tag-example tag-tag has-post-thumbnail">
    Thread Starter Elli_K

    (@elli_k)

    Kiitos! Noin pitkälle olin päässyt jo itsekin, ennenkuin tulin jeesiä kyselemään 🙂
    Kokeiltuna on varmaan kymmeniä vaihtoehtoja tyylitiedostoon, onnistumatta, ja itsellä ei vaan kertakaikkiaan riitä logiikka siihen miten esim. määritän tyylin etusivulla .category-photosin alla olevalle yksittäiselle .cat-linksille. Ja sama artikkeli kun voi kuulua jopa useampaan kategoriaan.
    Pelkkä tyylimäärittely .category-photos ei myöskään tee mitään millään sivulla. Olen tätä googletellut pari päivää, ja kategorioiden tyylittelyyn näytetään tarjottavan lähinnä joko plugaria, tai sitä että functions.php:n tai headerin kautta kutsuu erilliset tyylitiedostot. Yhtenä vaihtoehtona on, että yksittäiselle postaukselle antaa erillisen tyylin. Mutta mikään niistä ei ulotu etusivulle asti, eikä ole muutenkaan nyt se optimaalisin ratkaisu.

    Moderator Sami Keijonen

    (@samikeijonen)

    Esim. näin

    .category-photos {
       background: #ddd;
       color: #000;
    }

    tai

    .category-photos.tag-example {
       background: #ddd;
       color: #000;
    }
    Thread Starter Elli_K

    (@elli_k)

    Heh, kiitos. Ihan noin karvalakki -tasolla sentään en ole css:n kanssa 😀

    Moderator Sami Keijonen

    (@samikeijonen)

    Mutta et saanut toimimaan vai?

    Thread Starter Elli_K

    (@elli_k)

    Löysin kohtuullisen ratkaisun, mutta joka ei ole ilmeisen optimaalinen, eli bugittaa.

    Moderator Sami Keijonen

    (@samikeijonen)

    Just sen takia kysyin kun itselläni tuo äskeinen toimii aivan hyvin. Laita linkkiä sivuille, niin on helpompi katsoa mikä voisi olla pielessä.

    Thread Starter Elli_K

    (@elli_k)

    Tuossa pelkässä .category -määrittelyssä oli näköjään ainakin itsellä ongelmana se, että lapsileiska perii osan jutuista äitileiskalta. Mutta sitten kun lisäsin määrittelyyn .hentry mukaan, lapsileiska löysi sen. Ja samalla periaatteella sitten kategorian itemin, ja jotka toimivat nyt, paitsi josko samalla artikkelilla on monta eri kategoriaa, jälkimmäiset perivät sen ensimmäisen tyylin, vaikka niillä omakin on.

    Firefoxin Web Developer on se mitä itse käytän, mutta siitä kun leiskannut viimeksi WP:tä, on sen verran aikaa, että versio oli vielä 2. jotain, ellei 1. jotain, ja sittemmin sinne on näköjään ilmestynyt liikaakin imho jo ihan ylimääräistä härvellystä, joten kesti hetken tajuta, mistä kohtaa oikeasti poimia ne olennaiset määrittelyt, ja mikä ylikirjoittaa minkäkin, kun esimerkiksi etusivun artikkelit ovat postaamasi esimerkin mukaisia.

    Työn alla oleva saitti on vielä suojattuna, joten valitettavasti ei hyötyä lähteä sitä näin julkisesti linkkaamaan.

Esillä 9 vastausta, 1 - 9 (kaikkiaan 9)
  • The topic ‘Eri css per kategoria ja tagi kaikilla sivuilla ja osioissa’ is closed to new replies.