Unikalne stylizowanie każdego wpisu WordPressa to sprytny sposób na wyróżnienie Twojej strony internetowej. Pozwala to podkreślić konkretne treści i dopasować projekt do charakteru Twojej marki.
Niektóre witryny używają niestandardowych teł dla przyklejonych postów lub nadają każdej kategorii własny styl. Te drobne poprawki sprawiają, że Twoje treści są bardziej uporządkowane i atrakcyjne wizualnie.
Ale może to być trudne. Bez odpowiednich narzędzi i kroków możesz zmarnować godziny na próby i błędy — lub co gorsza, przypadkowo zepsuć układ swojej witryny.
Wykonaliśmy badania za Ciebie i znaleźliśmy kilka prostych metod na różne stylowanie wpisów.
Korzystając z WPCode, najlepszej wtyczki do fragmentów kodu dla WordPress, możesz łatwo dodawać niestandardowe style do swoich postów i tworzyć unikalny wygląd dla każdego – bez wysiłku.
Uwaga: Ten samouczek wymaga od Ciebie dodania niestandardowego CSS w WordPressie. Będziesz także musiał umieć korzystać z narzędzia Inspektora i mieć podstawową wiedzę o CSS, więc może nie być odpowiedni dla całkowicie początkujących.
Zalety i wady stylizowania każdego wpisu WordPressa inaczej
Jeśli masz bloga WordPress, stylizowanie każdego wpisu inaczej może stworzyć unikalne wrażenia wizualne, gdzie różne kolory są powiązane z różnymi kategoriami lub typami treści.
Na przykład możesz użyć innego koloru tła dla listów, postów na blogu i samouczków na swojej stronie internetowej. Może to natychmiast przyciągnąć uwagę użytkowników i zwiększyć zaangażowanie.
Pamiętaj, że zrobienie tego może mieć również pewne poważne wady. Na przykład, będziesz musiał regularnie utrzymywać projekt każdego posta WordPress, co może być czasochłonne.
Ponadto może to zapewnić niespójne wrażenia użytkownika i nie pomoże w budowaniu Twojej tożsamości marki. Głównie dlatego, że musisz używać tych samych kolorów w całej swojej witrynie, aby ugruntować wizerunek swojej firmy.
Jeśli jesteś początkujący, dodawanie niestandardowego CSS do stylizacji każdego wpisu może być trudne. Biorąc to pod uwagę, pokażemy Ci, jak łatwo stylizować każdy wpis WordPress inaczej.
Oto szybki przegląd wszystkich tematów, które omówimy w tym przewodniku:
- Jak stylizować poszczególne wpisy w WordPressie
- Jak stylizować wpisy w konkretnej kategorii
- Jak stylizować wpisy inaczej w zależności od autora
- Jak stylizować posty na podstawie popularności za pomocą liczby komentarzy
- Bonus: Wyświetl inny pasek boczny dla każdego posta w WordPress
Zacznijmy.
Jak stylizować poszczególne wpisy w WordPressie
WordPress dodaje domyślne klasy CSS do różnych elementów na Twojej stronie. Motywy używają podstawowej funkcji WordPress o nazwie post_class(), aby poinformować WordPress, gdzie dodać te domyślne klasy CSS dla wpisów.
Jeśli odwiedzisz swoją stronę internetową i użyjesz narzędzia Inspekcja w swojej przeglądarce, będziesz w stanie zobaczyć te klasy dodane do każdego wpisu.
Poniżej znajdują się klasy CSS dodawane domyślnie w zależności od tego, którą stronę przegląda użytkownik:
- .post-id
- .post
- .attachment
- .sticky
- .hentry (strony z mikrodanymi hAtom)
- .category-ID
- .category-name
- .nazwa-tagu
- .format-{format-name}
- .type-{nazwa-typu-wpisu}
- .has-post-thumbnail
Przykładowe wyjście wyglądałoby tak:
<article id="post-412" class="post-412 post type-post status-publish format-standard hentry category-news">
Możesz stylizować każdy post WordPress inaczej, używając odpowiednich klas lub identyfikatorów CSS. Aby to zrobić, najpierw musisz znaleźć identyfikator posta dla pojedynczego wpisu.
W tym celu musisz odwiedzić stronę Wpisy » Wszystkie wpisy z panelu WordPress i najechać kursorem myszy na wpis.
Adres URL edycji wpisu pojawi się teraz w lewym dolnym rogu ekranu. Tutaj możesz znaleźć identyfikator wpisu, patrząc na liczbę między „post=” a „&action.”
W poniższym przykładzie identyfikator posta to 25.
Po wykonaniu tej czynności musisz dodać klasę CSS wraz z niestandardowym kodem do plików motywu lub w dostosowywaczu motywu. Może to być jednak ryzykowne i spowodować awarię witryny z powodu jednego błędu.
Dlatego zalecamy używanie WPCode zamiast tego.
Po dokładnym przetestowaniu uznaliśmy, że jest to najłatwiejszy i najbezpieczniejszy sposób dodawania niestandardowego kodu do Twojej witryny. Aby dowiedzieć się więcej o naszym doświadczeniu z wtyczką, zapoznaj się z naszą recenzją WPCode.
Najpierw musisz zainstalować i aktywować darmową wtyczkę WPCode. Szczegółowe informacje znajdziesz w naszym przewodniku dla początkujących jak zainstalować wtyczkę WordPress.
Uwaga: Jeśli podoba Ci się darmowa wersja, przejście na WPCode Pro może przenieść Twoje doświadczenie na wyższy poziom. Wersja premium odblokowuje dostęp do ponad 100 fragmentów kodu zweryfikowanych przez ekspertów, inteligentnej logiki warunkowej, zaplanowanych zmian kodu i wiele więcej.
Po aktywacji odwiedź stronę Code Snippets » + Add Snippet z panelu administracyjnego WordPress. Tutaj kliknij przycisk „Use Snippet” pod opcją „Add Your Custom Code (New Snippet)”.
To przeniesie Cię do strony „Utwórz niestandardowy fragment kodu”, gdzie możesz zacząć od dodania nazwy dla swojego fragmentu kodu. Następnie wybierzmy „Fragment kodu CSS” jako typ kodu z menu rozwijanego po prawej stronie.
Następnie musisz dodać klasę CSS i identyfikator poszczególnych postów do pola „Podgląd kodu” w następujący sposób:
.post-13 { }
Po tym możesz dodać dowolny niestandardowy kod CSS między nawiasami, aby stylizować swój wpis.
Na przykład, jeśli chcesz zmienić kolor tła pojedynczego wpisu, możesz dodać następujący niestandardowy kod CSS. Pamiętaj, że musisz zastąpić identyfikator wpisu w tym kodzie swoim własnym identyfikatorem. Tam, gdzie jest .post-13, Twój może być .post-23873.
Możesz również zmienić kod szesnastkowy dla koloru tła na dowolny kolor według własnego wyboru:
.post-13 {
background-color: #FF0303;
color:#FFFFFF;
}
Następnie przełącz przełącznik „Nieaktywny” na górze na „Aktywny” i kliknij przycisk „Zapisz fragment”, aby zapisać ustawienia.
Niestandardowy kod CSS zostanie teraz automatycznie wykonany na Twoim indywidualnym poście po aktywacji fragmentu.
Odwiedź swój wpis na blogu WordPress, aby zobaczyć zmiany w czasie rzeczywistym.
Możesz również dodać inne niestandardowe fragmenty kodu CSS w polu „Podgląd kodu”, aby zmienić kolor zaznaczenia tekstu, kolor tekstu, kolor linków wewnętrznych i wiele więcej.
Więcej informacji znajdziesz w naszym przewodniku dla początkujących na temat dostosowywania kolorów w WordPress.
Jak stylizować wpisy w konkretnej kategorii
Jeśli chcesz stylizować wszystkie posty należące do określonej kategorii, możesz to zrobić również za pomocą WPCode.
Musisz odwiedzić stronę Fragmenty kodu » + Dodaj fragment i wybrać opcję „Dodaj własny kod (nowy fragment)”.
Następnie dodaj nazwę fragmentu kodu na nowej stronie i wybierz „Fragment kodu CSS” jako typ kodu. Po tym wpisz klasę CSS konkretnej kategorii w polu podglądu kodu w następujący sposób, używając sluga permalink kategorii po myślniku:
.kategoria-książki { }
Gdy to zrobisz, możesz dodać dowolny niestandardowy fragment kodu CSS do pola i zastosować go do wszystkich postów w różnych kategoriach.
Na przykład, jeśli chcesz zmienić rozmiar i styl czcionki dla wszystkich wpisów w określonej kategorii, możesz użyć następującego fragmentu kodu. Pamiętaj tylko, aby zastąpić nazwę kategorii zgodnie z Twoją stroną internetową.
category-books {
font-size: 18px;
font-style: italic;
}
Następnie musisz przełączyć przełącznik „Nieaktywny” na „Aktywny” u góry.
Następnie kliknij przycisk „Zapisz fragment”, aby zachować swoje ustawienia.
Możesz teraz odwiedzić wszystkie posty w określonej kategorii, aby zobaczyć zmiany zastosowane za pomocą kodu CSS.
Tak to wyglądało na naszej stronie demonstracyjnej:
Jak stylizować wpisy inaczej w zależności od autora
Domyślne klasy CSS generowane przez funkcję the_posts() nie zawierają nazwy autora jako klasy CSS.
Jeśli chcesz dostosować styl każdego wpisu na podstawie autora, najpierw musisz dodać imię autora jako klasę CSS.
Aby to zrobić za pomocą WPCode, możesz wybrać opcję „Dodaj własny kod (nowy fragment)”.
Spowoduje to przejście do strony „Utwórz niestandardowy fragment”, gdzie musisz dodać nazwę fragmentu kodu i wybrać „Fragment PHP” jako typ kodu.
Następnie po prostu dodaj poniższy niestandardowy kod do pola „Podgląd kodu” i zastąp „user_nicename” nazwą autora.
$author = get_the_author_meta('user_nicename'); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class( $author );
Na koniec możesz przełączyć przełącznik „Nieaktywny” na „Aktywny” i kliknąć przycisk „Zapisz fragment”, aby zapisać swoje ustawienia.
Powinno to wyglądać tak:
Ten kod doda teraz przyjazną dla użytkownika nazwę jako klasę CSS. Przyjazna nazwa to nazwa przyjazna dla adresu URL używana przez WordPress. Nie zawiera spacji, a wszystkie znaki są małymi literami, co czyni ją idealną do użycia jako klasa CSS.
Teraz musisz ponownie odwiedzić stronę Code Snippets » + Add Snippet i wybrać opcję „Add Your Custom Code (New Snippet)”.
Na następnym ekranie będziesz chciał dodać nazwę dla swojego niestandardowego kodu i wybrać „Fragment CSS” jako typ kodu z menu rozwijanego po prawej stronie.
Następnie możesz dodać konkretne imię autora w polu „Code Preview” w ten sposób:
.sarahclare
Następnym krokiem jest dodanie niestandardowego kodu CSS, aby zmienić kolor tła, rozmiar obramowania, kolor tekstu i inne.
Możesz użyć poniższego kodu, aby zmienić kolor tła wpisów autora i dodać obramowanie do obszaru treści.
.sarahclare {
background-color:#EEE;
border:1px solid #CCC;
}
Po zakończeniu kliknij przycisk „Zapisz fragment” na górze.
Następnie nie zapomnij przełączyć przełącznika „Nieaktywny” na „Aktywny”.
Niestandardowy kod zostanie automatycznie wykonany po aktywacji.
Teraz możesz odwiedzić post konkretnego autora, aby zobaczyć zmiany.
Jak stylizować posty na podstawie popularności za pomocą liczby komentarzy
Mogłeś widzieć strony z widgetami popularnych postów, które czasami opierają się na liczbie komentarzy. W tym przykładzie pokażemy, jak stylizować posty inaczej, używając liczby komentarzy.
Najpierw musimy uzyskać liczbę komentarzy i powiązać z nią klasę.
Aby uzyskać liczbę komentarzy, musisz dodać następujący kod do plików swojego motywu, lub możesz użyć wtyczki fragmentów kodu, takiej jak WPCode.
Po prostu wybierz opcję „Dodaj własny kod (nowy fragment)” (Add Your Custom Code (New Snippet)), aby uruchomić stronę „Utwórz własny fragment” (Create Custom Snippet) w WPCode.
Tutaj chcesz wybrać „Fragment PHP” jako „Typ kodu”, a następnie skopiować i wkleić poniższy kod do pola „Podgląd kodu”:
<?php
$postid = get_the_ID();
$total_comment_count = wp_count_comments($postid);
$my_comment_count = $total_comment_count->approved;
if ($my_comment_count <10) {
$my_comment_count = 'new';
} elseif ($my_comment_count >= 10 && $my_comment_count <20) {
$my_comment_count = 'emerging';
} elseif ($my_comment_count >= 20) {
$my_comment_count = 'popular';
}
?>
Następnie kliknij przycisk „Zapisz fragment” i przełącz przełącznik „Nieaktywny” na „Aktywny”, aby zapisać swoje ustawienia.
Ten kod sprawdza liczbę komentarzy dla wyświetlanego posta i przypisuje im wartość na podstawie tej liczby.
Na przykład posty z mniejszą liczbą niż 10 komentarzy otrzymują klasę „new”, mniejsza liczba niż 20 jest określana jako „emerging”, a wszystko powyżej 20 komentarzy jest „popular”.
Teraz musisz dodać liczbę komentarzy jako klasę CSS do funkcji post_class. Aby to zrobić, musisz ponownie otworzyć stronę „Utwórz niestandardowy fragment” i wybrać opcję „Fragment PHP” z menu rozwijanego.
Następnie możesz dodać następujący niestandardowy kod do pola podglądu:
<article id="post-<?php the_ID(); ?>" <?php post_class( $my_comment_count ); ?>>
Następnie po prostu kliknij przycisk „Zapisz fragment”.
Następnie możesz przełączyć przełącznik „Inactive” na „Active”.
Doda to klasy CSS „new”, „emerging” i „popular” do wszystkich postów w zależności od liczby komentarzy, które ma każdy post. Możesz teraz dodać niestandardowy CSS, aby stylizować każdy post w zależności od jego popularności.
Na przykład, możesz użyć następującego kodu, aby dodać różne kolory obramowania dla wpisów w zależności od liczby komentarzy dodanych do nich:
.new {border: 1px solid #FFFF00;}
.emerging {border: 1px dashed #FF9933;}
.popular {border: 1px dashed #CC0000;}
Po zakończeniu nie zapomnij kliknąć przycisku „Zapisz fragment”, aby zachować swoje ustawienia.
Bonus: Wyświetl inny pasek boczny dla każdego posta w WordPress
Po odmiennym stylizowaniu każdego posta, możesz również chcieć dodać unikalny pasek boczny dla każdego posta. Pozwoli to na prezentację konkretnych treści związanych z tym artykułem, które mogą zainteresować użytkowników.
Na przykład, jeśli masz bloga podróżniczego i opublikowałeś post o miejscach do odwiedzenia na Florydzie, możesz utworzyć specjalny pasek boczny wyświetlający pakiety podróżne na Florydę. Alternatywnie, możesz wyświetlić formularz rejestracyjny na wycieczkę na Florydę, którą organizujesz.
Możesz użyć SeedProd, czyli najlepszego wtyczki kreatora stron dla WordPress, aby wyświetlić inny pasek boczny dla każdego posta.
Posiada interfejs przeciągnij i upuść, ponad 320 gotowych szablonów oraz integracje z usługami marketingu e-mail, co czyni go świetnym wyborem.
Po aktywacji wtyczki możesz wybrać niestandardową stronę jako stronę docelową projektu, a następnie układ z paskiem bocznym.
Następnie możesz łatwo przeciągać i upuszczać wybrane bloki z lewej kolumny, w tym formularze kontaktowe, archiwa, prezenty, pola wyszukiwania, komentarze i inne.
Po zakończeniu kliknij przyciski „Zapisz” i „Opublikuj” z menu rozwijanego na górze.
Pomyślnie zaprojektowałeś teraz dedykowany pasek boczny dla posta lub strony WordPress.
Aby uzyskać więcej informacji, zapoznaj się z naszym samouczkiem na temat jak wyświetlić inny pasek boczny dla każdego wpisu i strony w WordPress.
Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak stylizować każdy wpis WordPressa inaczej. Możesz również zapoznać się z naszymi poradnikami dla początkujących na temat jak dodać favicon i jak dodać spadające płatki śniegu do swojego bloga WordPress.
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.
Rafael
Świetny artykuł. Zgaduję, że mógłbym użyć czegoś takiego do sprawdzenia kategorii posta i umieszczenia niestandardowego CSS, aby zmienić styl części strony internetowej zgodnie z kategorią, prawda?
Chciałbym ustawić różne kolory tylko dla tła tytułu wpisu dla każdej kategorii na blogu.
Kany
Cześć, świetny artykuł. Jak niestandardowo stylizować CSS najnowsze wiadomości z bloga? Tylko najnowsze, jakieś pomysły? Dzięki.
Wsparcie WPBeginner
Twój motyw musiałby dodać coś, co można by skierować za pomocą CSS; obecnie nie mamy zalecanej metody dodawania tego.
Admin
Les
Świetny artykuł. Chciałem ustawić domyślny rozmiar czcionki dla każdej kategorii i postępowałem zgodnie z instrukcjami, dodając kod do pliku Style.css, ale po dodaniu nowego posta czcionka miała stary rozmiar. Widzisz kod? Czegoś brakuje?
/* Begin Additional CSS Styles */
.art-blockheader .t, .art-vmenublockheader .t {white-space: nowrap;}
.desktop .art-nav-inner{width: 1200px!important;}
.category-firstg {
font-size: 18px;
font-style: bold;
}
/* Koniec dodatkowych stylów CSS */
William D
Świetny artykuł, dziękuję bardzo. Czy kolor przycisku „czytaj więcej”/kolor tekstu również można zmienić w podobny sposób? Coś (prawdopodobnie ja) zmieniło moje przyciski w bardzo nieprzyjemny sposób i mam ogromne trudności ze znalezieniem sposobu, aby znów wyglądały przyjemnie.
Z góry dziękuję za wszelką pomoc, którą możesz udzielić!
Matus
Świetny tutorial. Proste i jasne wyjaśnienie.
Neon Emmanuel
Witam, jeśli umieszczę to w single.php, to wyświetla tytuł bieżącego posta, ale działa dobrze w index.php, jakieś sugestie?
MayMyatKhine
Witam, proszę o przesłanie nowego wydarzenia do wykorzystania w WordPressie.
marisa
To świetny artykuł, ale mam problem z umieszczeniem
ID, „post-class”); ?>
Gdzie dokładnie w pętli mam to umieścić? Używam underscore.me z foundation 5 i moja nowa klasa się nie pojawia.
Alberto Hartzet
Doskonale!, dzięki. A co z pierwszym i „ostatnim” postem? jakieś pomysły?
Nadeem
Dzięki wielkie bracie.. to bardzo pomocne
RW
kolejna zakładka! świetny post! dziękuję...
Payal
Bardzo pouczające, dziękuję. Dodałem tę stronę do zakładek.
Mam też pytanie: Co jeśli chciałbym inaczej stylizować pierwszy (najnowszy) post – tak, aby post wyświetlany na górze mojej strony indeksu wyglądał inaczej?
James
Hej, mam z tym teraz problem..
Moja pętla postów nie wydaje się mieć funkcji post_class, więc nie mogę rozgryźć, gdzie umieścić powyższy kod...
To jest pętla, której używam do postów, gdzie umieściłbym powyższy kod? Lub jak sprawić, by niestandardowe pola działały przy użyciu tego?
Personel redakcyjny
Musisz dodać coś w tym stylu w swoim pętli wpisów:
1-click Use in WordPress
Admin
Jon Fuller
Witam, jestem całkiem nowy w tworzeniu motywów WordPress i szukam sposobu na wyświetlanie każdego posta w osobnym polu, oddzielonym marginesem górnym i dolnym. Proszę wyjaśnij, jak jest to możliwe.
Dzięki
Personel redakcyjny
Domyślnie każdy post znajduje się we własnym elemencie div. Wystarczy użyć CSS, aby dodać marginesy górny i dolny.
Admin
Shaun
Jestem ciekawy, jak można by to zastosować do dodania klasy CSS tylko do postów, które mają tę samą „wartość meta” lub „numer wartości meta”?
Dzięki za świetny tutorial, tak przy okazji!
Pozdrawiam
Personel redakcyjny
Pokazaliśmy, jak to zrobić za pomocą niestandardowych pól, ale to jest robione według klucza. Ale jeśli masz ten sam klucz z wieloma wartościami, powinieneś użyć funkcji get_post_custom_values.
Admin
Em
Właśnie znalazłem ten wpis i jest świetny, jasny, zwięzły i trafny, wielkie dzięki
Jim
Chciałbym zrobić coś takiego, gdzie pierwszy wpis dostaje klasę „1”, drugi wpis „2”, trzeci wpis „3”, a potem powtarza ten porządek, więc czwarty wpis znowu dostaje „1”.
Jakieś wskazówki? to po prostu powtarzanie trzech różnych klas co trzy posty.
Personel redakcyjny
Musiałbyś użyć opcji super loop.
Admin
Brit
Chcę konkretnie zrobić tak, aby gdy ktoś wejdzie na mojego bloga, miniaturka (która jest po prostu kółkiem z tytułem posta) miała inny kolor TYLKO dla najnowszego posta. Nie mam pojęcia, jak to osiągnąć. Wszystko, co znalazłem, jest specyficzne dla kategorii lub kolejności. Myśli?
Personel redakcyjny
Brit, musiałabyś użyć ostatniej metody „Super Loop”. To prawdopodobnie jedyny sposób, aby to zrobić, ponieważ na pierwszym wpisie dodasz unikalną klasę, taką jak „first-post”, a następnie wystylizujesz ją za pomocą pliku CSS.
Admin
Jayaseelan Arumugam
To bardzo miły i użyteczny post. Szczególnie podoba mi się sposób stylowania postów na podstawie niestandardowych pól. Dziękuję.
Kathleen
Thanks for this great article! It’s exactly what I searched for and so much helpful!
dina
Jak dodać unikalną klasę do 3., 6., 9. i 12. postu w super pętli. Dzięki!
vajrasar
Cóż, to bardzo dobry fragment. Rozumiem, co powiedziałeś, ale czy możesz rzucić trochę światła na to, jak mam to zaimplementować w moim motywie potomnym Genesis dla wiadomości, ponieważ mam to wszystko zrobić za pomocą function.php
Chciałbym stylizować posty specyficzne dla kategorii inaczej. Dziękuję bardzo za ten artykuł. Bardzo pouczający.
Personel redakcyjny
Jeśli więc po prostu używasz metody klasy post, Genesis ma pole w swoich ustawieniach układu dla każdego posta. Możesz wprowadzić niestandardową klasę i stylizować ją w ten sposób. Reszta może stać się dość skomplikowana w zależności od wszystkich haków i tym podobnych. Nie publikujemy tutaj artykułów specyficznych dla Genesis.
Admin
jim
Co masz na myśli index.php w pętli. który index.php. Mój nie ma niczego podobnego do twojego. To 10. post, jaki przeczytałem, gdzie nikt poprawnie nie wyjaśnił tej podstawowej koncepcji. A co z CSS. Ostatnie 10 postów też tego nie wyjaśniło. Internet staje się coraz gorszy.
Personel redakcyjny
Hej Jim,
Każdy motyw WordPress robi rzeczy inaczej. Koncepcja pętli jest dość dobrze wyjaśniona w WordPress Codex. Wymaga prostego wyszukiwania w Google: Loop WordPress, które zaprowadzi Cię do: http://codex.wordpress.org/The_Loop
Ponieważ każdy motyw jest inny, niektóre wykorzystują osobny plik loop.php, inne to motywy potomne, które nawet nie mają plików index.php. Naprawdę trudno jest wyjaśnić wszystkie te koncepcje. Kiedy umieszczamy samouczki w kategorii motywów, oczekujemy, że użytkownicy będą mieli dobrą wiedzę o tym, jak działają motywy WordPress (nawet jeśli nie znasz PHP).
Admin
Haider E Karrar
Myślę, że powinieneś zamiast tego używać filtrów w połączeniu z tagami szablonu tutaj http://codex.wordpress.org/Conditional_Tags
Na przykład
function my_post_css_filters($content) { if(is_category(…)) return ” $content “; else if (something else) ….
}
add_filter(‘the_content’, ‘my_post_css_filters’, 1) — (priorytet 1, nie jestem pewien, na co jeszcze może wpłynąć).
Hossein
Cześć..
Jak mogę opakować co 4 posty w div?
gashface
Nieważne, udało mi się to naprawić, ale TERAZ nie stylizuje każdego posta inaczej, tylko stylizuje je wszystkie zgodnie z pierwszym autorem posta, którego znajdzie?
gashface
Czy jest sposób na określenie tagu, na przykład H2, stylizowanego przez autora? Próbuję .username h2{}, na przykład, ale to nie działa?
gashface
U mnie to nie pokazuje autora, tylko pustą przestrzeń, wkleiłem twój dokładny kod, jakieś pomysły? posty napisane przez administratora i są prywatne, czy to ma znaczenie?
wpbeginner
@gashface nie ma znaczenia, czy post jest prywatny, czy publiczny… Jeśli zwraca białą stronę, to wklejasz kod w złym miejscu.
gashface
Zdałem sobie sprawę, że to dlatego, że umieszczałem kod przed wywołaniem pętli, myślałem, że masz na myśli przed if have posts itp. kiedy musi być po tym, dzięki za informację
KimeeDoherty
This was a little helpful, but I am still lost
Not sure how to include the loop file in order to override the template. You started the <div> tag but not ended them, what’s inside the div? I’m lost 
kristelvdakker
Bardzo dziękuję za ten post! Był bardzo pomocny.
Stuart
Cześć, dzięki za pomysły – zwłaszcza za super pętlę – cieszę się, że udało mi się uruchomić to na mojej stronie.
Ale zastanawiam się, jestem kompletnym początkującym w PHP, więc czy jest sposób, aby dostosować kod tak, aby każda kolejna strona postów nie otrzymywała stylizacji, którą posty 1, 2, 3 i 4 otrzymują na pierwszej stronie.
Innymi słowy, chcę, aby tylko pierwsze cztery wpisy na pierwszej stronie wyglądały inaczej niż pozostałe.
Pozdrawiam, Stu
Personel redakcyjny
Tak. Możesz użyć warunkowego znacznika is_paged(), aby wyświetlał się tylko na pierwszej stronie, ale nie na innych. Możesz również użyć is_home()… aby wyświetlał się tylko na stronie głównej.
Admin
Stuart
Super – dziękuję. Wygląda na to, że is_paged() jest dla mnie odpowiednie – ale niestety, moje nowicjuszowe umiejętności oznaczają, że mam trudności z ustaleniem, jak zintegrować je z kodem.
Stuart
W końcu się udało...
Michael
Jeśli chcesz użyć tego podejścia do wizualnego rozdzielenia postów na podstawie daty publikacji. Jak byś to zrobił? Na przykład: stylizuj 5 postów opublikowanych 1. dnia z czarnym tłem, a następnie stylizuj posty opublikowane 2. dnia z czerwonym tłem? Z góry dziękuję!
Personel redakcyjny
Najlepszym sposobem na zrobienie tego jest użycie metody superloop. Gdzie używasz zmiennej licznika do ustawienia wartości klas postów.
Admin
Dale
Próbuję nadać każdemu imieniu autora inny kolor na naszej stronie WordPress i postępowałem zgodnie z twoim kodem, jak poniżej:
Chociaż ten kod działa w moim motywie WordPress, dodaje znaki cudzysłowu po klasie-2, ale przed nazwiskiem autora, więc klasa jest zamykana bez nazwiska w środku. Dowiedziałem się o tym dopiero po umieszczeniu tego kodu PHP w treści, gdzie można zobaczyć cały ciąg znaków.
Czy ktoś ma pomysł, dlaczego tak się dzieje?
Dale
Przepraszam, że usunęło php, które wstawiłem, ale oto wynik stylizacji moich postów według nazwy autora. Autor nazywa się tutaj admin, i jak widać, tag zamykający znajduje się przed nazwą autora admin.
“post-395 post type-post hentry category-uncategorized class-1 class-2″admin
Bec
Świetny post! Te informacje są niesamowite do dodawania tych dodatkowych, specjalnych, niestandardowych funkcji do Twojego projektu.
Adam W. Warner
Rzeczywiście świetny post, czapki z głów! Jednak nie mogłem się powstrzymać od myślenia o tym, kiedy nadejdzie czas na aktualizację motywu, do którego wprowadzasz wszystkie te niestandardowe edycje. Staram się używać pliku functions, kiedy tylko jest to możliwe, aby uniknąć nadpisywania.
Myślę, że lepiej byłoby włączyć te edycje pętli do funkcji. Wiem, że w przypadku motywów nadrzędnych, takich jak Thematic, Hybrid, Genesis itp., możliwe (i zalecane) jest filtrowanie pętli, a tym samym wprowadzanie tych zmian.
@Ken – Czy Twój wtyczka mogłaby wyeliminować potrzebę stosowania jakichkolwiek funkcji?
Tak czy inaczej, to tylko moje dwa centy i gratulacje dla Syeda i zespołu za Waszą ciągłą doskonałość na tej stronie!
Azad Shaikh
Bardzo przydatny post. Dlaczego nie publikujesz motywów WordPress z twoimi wspaniałymi pomysłami i funkcjonalnością. Odniosłoby to wielki sukces.
Dzięki!
Ken
Twój artykuł dał mi kilka pomysłów na ulepszenie mojego wtyczki, dzięki za to!
Napisałem właśnie wtyczkę (Scripts n Styles) do dodawania CSS bezpośrednio do elementu head z ekranu edycji posta/strony. (Mogą to robić tylko użytkownicy administracyjni.) Nie jest ona tak solidna (lub raczej nie dotyczy tego samego), jak Twoje rozwiązanie, ponieważ CSS pojawia się tylko w widoku pojedynczym, a nie na listach (archiwach).
Rozważam dodanie funkcjonalności umożliwiającej uwzględnienie nazwy klasy w post_class, ale za pośrednictwem pola meta na ekranie administracyjnym. Wtedy administrator będzie musiał tylko dodać kod CSS do swojego motywu. (Lub, być może, ekran ustawień, aby to ułatwić?)
Tak czy inaczej, Super Loop wydaje się przydatny do ogólnego tworzenia motywów, muszę go uwzględnić w moim następnym!
Connor Crosby
Wow, that is a great post! Perfect timing since I am making a new Wordpress theme