Wtyczka Content Views pomaga rozwiązać problem niestandardowego wyglądu głównych (i pozostałych) stron bloga. Domyślnie szablon witryny wyświetla wpisy na blogu jeden po drugim, zaczynając od najnowszego. Edytując szablon, możesz ustawić wyświetlanie daty, tytułu, kategorii, autora i kilku innych parametrów, ale logiki wybierania postów nie można zbytnio zmienić (bez dodawania specjalnego kodu PHP i funkcji). Dlatego dzisiejszy moduł może być przydatny dla wielu początkujących i programistów WordPressa.

Pozwala dostosować wyświetlanie postów na stronie głównej i innych stronach bloga bez specjalistycznej wiedzy programistycznej - możesz go pobrać stąd. Nazwa na stronie repozytorium jest jakoś za długa” Zapytaj o posty według kategorii… i wyświetlaj posty na stronie w układzie siatki bez kodowania – Widoki treści”, jeśli instalujesz WordPress przez panel administracyjny, spróbuj wyszukać klucz Widoki treści. Wymagana wersja WP jest wyższa niż 3.3 i aż do 4.2.2 (w momencie pisania tego posta), moduł pobrało już ponad 10 tys. razy ocena jest prawie maksymalna!

Możliwości modułu są dość duże i dotyczą nie tylko strony głównej. Dzięki niemu możesz:

• wyświetlaj posty według kategorii w responsywnym designie na stronie głównej;
• wyświetlaj wpisy na blogu w 2/3 kolumnach;
• wyświetlaj posty w w wymaganym formacie na określonej stronie;
• wyświetl notatki na do żądanego tagu lub autor;
• Dla wyświetlanych wpisów wybierz sortowanie według tytułu lub daty;
• zastąpić standardową nawigację piękniejszą;
• wyświetlaj miniatury o różnych rozmiarach w ogłoszeniach o postach.

W zasadzie można by skonfigurować wyświetlanie najnowszych postów według kategorii, o których wspomniałem przy okazji (poprzez WP_Query). Ale nie każdy użytkownik to zrozumie, a wtyczka Content Views znacznie upraszcza to zadanie. Rozważmy bardziej szczegółowe prace z modułem.

Po instalacji w panelu administracyjnym pojawi się sekcja wtyczek Ustawienia widoku zawartości. Aby utworzyć nowy element wyświetlania postu, kliknij link „Dodaj nowy”.

Tutaj zadanie jest podzielone na 2 komponenty:

• Ustawienia filtrów — ustawienie parametrów wyboru rekordów;
• Ustawienia wyświetlania - format wyświetlania postów.

W pierwszym kroku określasz rodzaj postu – stronę lub post. Możesz uwzględnić lub wykluczyć określone identyfikatory z listy. Parametr Limit określa liczbę elementów.

Tuż poniżej, w filtrach zaawansowanych, dzieją się wszystkie zabawne rzeczy. Na zrzucie ekranu widać, jak sprawdziłem parametr Taksonomie i ustawiłem wybór według kategorii. Następnie zdefiniowałem kategorię, z której będą wyświetlane posty. Można dokonać selekcji według kilku nagłówków lub wykluczyć niektóre z listy ogólnej.

Oprócz parametru Taksonomie dostępne są:

• Status — stan wyświetlanych rekordów. Uwaga! Jeśli chcesz wyświetlać tylko opublikowane posty, ustaw także ten parametr (wartość Publikuj).
• Order & Orderby - opcje sortowania.
• Szukaj — wyświetla rekordy według wyszukiwanej frazy.
• Autor - wybór dla konkretnego autora.

Zakładka Ustawienia wyświetlania zawiera ustawienia wyglądu bloku:

Istnieją trzy formaty wyświetlania: siatka, lista zwijana, lista przewijana. W przypadku „siatki” możesz wybrać liczbę elementów w kolumnie i/lub 2 kolumnach, gdy są wyświetlane. Zaznacz także pola, które chcesz wyświetlić dla każdego elementu: data, tytuł, tekst, miniatura. Możesz wybrać opcję otwarcia łącza w nowym oknie.

Wszystkie te ustawienia pozwalają uzyskać właściwy typ wyświetlanie najnowszych wpisów na stronie głównej lub innych stronach serwisu.

Po określeniu wszystkich parametrów zapisz element. W menu „Wszystkie widoki” możesz zobaczyć listę wszystkich utworzonych bloków i skrótów do ich wstawiania. Możesz je opublikować zwykłe strony blogu lub w szablonie za pomocą funkcji wywołania krótkiego kodu:

Na koniec chciałbym powiedzieć, że wtyczka ma Wersja profesjonalna, którego jest trochę duża liczba opcje i ustawienia. Kosztuje 29 USD za 1 lub 89 USD za 5 witryn. Dodano tutaj 2 Dodatkowe opcje Wyświetl Pinterest, oś czasu, idzie całkowita wymiana wyświetlanie najnowszych wpisów w archiwach kategorii, tagów, autorów, pojawia się obsługa WooCommerce, dodany jest mechanizm Drag & Drop, a także wiele różnych parametrów dla wygląd Bloki. Zasadniczo, Darmowa wersja Wystarczyło mi rozwiązać problem oryginalnego projektu strony głównej witryny WordPress.

Niedawno jeden z naszych czytelników zapytał, czy istnieje sposób na dodanie treści ze strony WordPress do innej strony lub postu. W tym artykule pokażemy, jak wstawić treść z jednej strony WordPress do innego postu, strony lub dowolnego niestandardowego typu postu.

Przede wszystkim musisz zainstalować i aktywować wtyczkę Wstaw strony. Po aktywacji wystarczy przejść do sekcji Wpisy » Dodaj nowe panel administracyjny serwisu, aby zobaczyć go w akcji.

Jeśli używasz edytora wizualnego, zauważysz to nowy przycisk w menu tzw „Wstaw stronę”.

Kliknięcie go spowoduje wyświetlenie wyskakującego okna, w którym możesz wybrać stronę, post lub niestandardowy typ postu, który chcesz dodać.

Możesz wybrać sposób wstawiania do postu/strony, klikając Opcje. Domyślnie możesz dodać tytuł, treść, link lub wybrać niestandardowy szablon. Więcej o szablonach niestandardowych powiemy w dalszej części artykułu.

Po wybraniu wpisu/strony kliknij przycisk Wstaw stronę. Wtyczka do dodania krótkiego kodu wymaganego do wyświetlenia wybranego postu/strony.

Jeśli używasz Edytor tekstu aby tworzyć posty, krótki kod można wstawić ręcznie. Opcje krótkiego kodu są dość proste.

Parametr page dla krótkiego kodu akceptuje informację o stronie lub jej identyfikator. Pamiętaj, że slug może być dowolnym typem postu, niekoniecznie stroną.

Można także określić identyfikator wpisu. O tym, jak znaleźć identyfikator postu w WordPressie, już pisaliśmy.

Dodawanie niestandardowych typów postów do wpisów na blogu

Korzystając z WordPress, możesz dodawać dowolny typ treści, tworząc typy postów dla różne rodzaje treść.

Wtyczka Wstaw strony umożliwia dodawanie niestandardowych typów postów do stron i postów na blogu. Możesz na przykład utworzyć niestandardowy typ postu dla galerii obrazów, a następnie użyć opcji Wstaw strony, aby dodać te galerie do swoich postów lub stron.

W ten sam sposób możesz tworzyć niestandardowe typy postów dla filmów, portfolio, recenzji klientów itp. aby dodać je do postów/stron.

Używanie niestandardowych szablonów do wyświetlania wstawionych stron

Wstaw strony umożliwia wyświetlenie tytułu, łącza, treści lub wszystkich pól wstawionych stron. Jednak niektórzy użytkownicy mogą potrzebować więcej strojenie wyjście. Można to osiągnąć za pomocą niestandardowych szablonów.

Wszystko, co musisz zrobić, to utworzyć pusty plik php i prześlij go do folderu motywu. Plik może mieć dowolną nazwę. Na przykład niestandardowy autor.php.

Ten niestandardowy szablon działa dokładnie tak, jak każdy inny plik szablonu treści w Twoim motywie. Poniżej znajduje się przykład pliku szablonu, który utworzyliśmy w celu wyświetlania stron autorów.

Możesz użyć niestandardowych klas CSS w pliku szablonu, a następnie zastosować style w pliku arkusza stylów motywu. Do zaprojektowania strony autorskiej użyliśmy poniższego kodu.

H3.nazwa-autora (rozmiar czcionki:16px; ) .thumbnail-autora ( float:left; padding:10px; ) .author-bio ( styl czcionki:kursywa; rodzina czcionek: Lora, Georgia, Serif; )

Tak wygląda ostateczna wersja:

Mamy nadzieję, że ten artykuł pomógł Ci dodać treść z jednej strony/postu WordPress do innej.

WordPress to łatwy narkotyk w świecie tworzenia stron internetowych. Wiele osób, które zaczęły korzystać z tej platformy, początkowo szukało łatwego (i bezpłatnego) sposobu na stworzenie prostej strony internetowej. Wszystko to można zrobić za pomocą odrobiny Googlingu i porad zawartych w kodeksie WordPress. Krótko mówiąc: „Chciałem po prostu spróbować i wszystko się udało”.

Jednak wielu użytkowników nie poprzestaje na prostej znajomości. Zamiast tego zaczynają aktywnie korzystać z systemu. Wpadają na kolejne pomysły. Eksperymentują. Próbuję nowych wtyczek. Otwórz Firebuga. Wszystko. Punkt bez powrotu został już przekroczony. Zgadzasz się, czy to jest podobne do Twojej historii? Dla Użytkownicy WordPressa To normalne, że chcesz coraz więcej aspektów zarządzania swoją witryną. Chcesz unikalnego projektu, sprawdzonej funkcjonalności, personalizacji wszystkich szczegółów.

Na szczęście, WordPressa zaprojektowany specjalnie do tego. Jego elastyczna struktura i modułowa architektura pozwalają każdemu zmienić niemal wszystko na swojej stronie internetowej.

Wśród najważniejszych narzędzi dot pełna kontrola witryny, możesz zaznaczyć szablony stron. Pozwalają użytkownikom radykalnie zmienić wygląd i funkcjonalność swojej witryny internetowej. Chcesz zrobić zupełnie inny nagłówek dla swojej strony głównej? Łatwo. Dodatkowy pasek boczny, który pojawi się tylko na stronie bloga? Bez problemu. Unikalna strona 404? Proszę!

Jeśli chcesz dowiedzieć się, jak szablony stron WordPress mogą pomóc Ci rozwiązać te problemy, czytaj dalej. Najpierw jednak damy trochę podstawowe informacje konieczne, aby zrozumieć, jak działają szablony stron w WordPress.

Szablony WordPressa

Co mamy na myśli, mówiąc o szablonach w kontekście WordPressa? Krótko mówiąc, szablony to pliki, które mówią WordPressowi, jak wyświetlać dane wyjściowe różne rodzaje treść.

Aby wyjaśnić bardziej szczegółowo: za każdym razem, gdy ktoś prosi o wyświetlenie części Twojej witryny, platforma WordPress określa, jaką treść użytkownik chce otrzymać i jaka część Twojej witryny powinna zostać wyświetlona.

WordPress spróbuje następnie użyć najbardziej odpowiedniego szablonu dostępnego w Twoim motywie dla tej części witryny. Który dokładnie zależy od hierarchii szablonów WordPress. Możesz zobaczyć, jak wygląda ta hierarchia na zrzucie ekranu poniżej.

Hierarchia szablonów to lista znanych szablonów Pliki WordPressa szablony, które są uszeregowane w celu określenia, który plik ma najwyższy priorytet.

Można myśleć o tej hierarchii jako o drzewie decyzyjnym. Kiedy WordPress próbuje zdecydować, jak wyświetlić bieżąca strona, przechodzi w dół hierarchii szablonów, aż znajdzie pierwszy szablon pasujący do żądanej strony. Na przykład, jeśli ktoś spróbuje uzyskać dostęp do http://yoursite.com/category/news, WordPress będzie szukać pasującego szablonu w następującej kolejności:

1. kategoria-(slug).php: w w tym przypadku kategoria-aktualności.php
2. kategoria-(id).php>: Jeśli identyfikator kategorii wynosi 5, WordPress spróbuje znaleźć plik o nazwie kategoria-5.php
3. kategoria.php
4. archiwum.php
5. indeks.php

Na samym dole hierarchii znajduje się plik Index.php. Służy do wyświetlania dowolnej treści, która nie posiada specjalistycznego szablonu. Jeśli szablon znajduje się wyżej w hierarchii, WordPress automatycznie użyje go do wyświetlenia żądanej treści.

Szablony stron i ich zastosowania

W przypadku stron standardowym szablonem jest plik page.php. Jeśli nie jest dostępny lepszy szablon (np. Archive.php dla stron archiwum), WordPress użyje page.php do wyświetlenia zawartości wszystkich stron w Twojej witrynie.

Jednak w większości przypadków istnieje potrzeba zmiany wyglądu, wyglądu i funkcjonalności poszczególnych sekcji serwisu. W tym przypadku stosowane są szablony stron. Niestandardowe szablony stron umożliwiają dostosowanie dowolnej części witryny bez wpływu na resztę.

Być może widziałeś już to w akcji. Na przykład wielu dzisiaj Motywy WordPressa oferują opcje wyświetlania stron na pełnym ekranie, dodawania dodatkowego paska bocznego lub zmiany jego lokalizacji itp. Wszystko to jest zwykle realizowane za pomocą szablonów. Można to zrobić na kilka sposobów i przyjrzymy się im dalej.

Na początek jednak jedna uwaga: ponieważ praca z szablonami wiąże się z edycją i modyfikowaniem aktywnych plików motywów, zalecamy użycie motywu podrzędnego w celu wprowadzenia tych zmian. W ten sposób Twoje zmiany nie zostaną nadpisane po aktualizacji motywu nadrzędnego.

Jak zmienić dowolną stronę w WordPress

Istnieją trzy główne sposoby korzystania z niestandardowych szablonów stron w WordPress: dodawanie Instrukcje warunkowe do istniejącego szablonu; utworzenie szablonu dla konkretnej strony, która będzie zajmowała wyższą pozycję w hierarchii; jak również bezpośrednie przypisanie szablonów do określone strony. Przyjrzymy się po kolei każdej z tych metod.

Używanie znaczników warunkowych w szablonach standardowych

Najprostszym sposobem na wprowadzenie zmian jest osobna strona jest użycie tagów warunkowych w swoim szablonie. Jak sama nazwa wskazuje, znaczniki te służą do tworzenia funkcji, które są wykonywane dopiero po spełnieniu warunku. W kontekście szablonów stron wygląda to tak: „Wykonaj akcję X tylko na stronie Y”.

Zazwyczaj, tagi warunkowe są dodawane do szablonu page.php Twojego motywu (chyba że chcesz zmienić inną część witryny). Pomagają Ci wprowadzać zmiany tylko dla strona główna, stronę główną, stronę bloga lub dowolną inną stronę w Twojej witrynie.

Oto kilka typowych tagów warunkowych:

1. is_page(). Wskazuje konkretną stronę. Można go używać z identyfikatorem, tytułem i adresem URL/tytułem.
2. is_home(): Dotyczy strony głównej.
3. is_front_page(): dotyczy strona główna Twojej witryny, określonych w sekcji „Opcje” – „Czytanie”.
4. is _category(): Warunki strony kategorii. Można go używać z identyfikatorem, tytułem, adresem URL/tytułem, podobnie jak tag is_page().
5. is_single(): dla pojedynczych postów i załączników
6. is_archive(): warunek dla stron archiwum
7. is_404(): Dotyczy tylko stron 404

Na przykład, jeśli zamiast tego dodasz page.php do szablonu standardowy znacznik get_header(); poniższy kod, podczas wyświetlania strony http://yoursite.com/products otrzymasz niestandardowy nagłówek o nazwie header-shop.php.

If (is_page("produkty")) ( get_header("sklep"); ) else ( get_header(); )

Dobry przykład używając tego kodu: jeśli masz sklep na swojej stronie i chcesz wyświetlić inny obraz nagłówka lub zmodyfikowane menu na stronie sklepu. Możesz wprowadzić odpowiednie zmiany w pliku header-shop.php, aby mieć pewność, że wszystko to pojawi się w Twojej witrynie.

Jednak tagi warunkowe nie są ograniczone tylko do jednej strony. Możesz ustawić kilka warunków jednocześnie:

If (is_page("produkty")) ( get_header("sklep"); ) elseif (is_page(42)) ( get_header("about"); ) else ( get_header(); )

W tym przykładzie ustawiliśmy dwa warunki, które zmienią zachowanie różnych stron w Twojej witrynie. Oprócz wczytania nagłówka dla sklepu wspomnianego już powyżej, ładujemy header-about.php na stronę o ID 42. Dla wszystkich pozostałych stron wyświetli się standardowy nagłówek.

Tworzenie szablonów stron w hierarchii szablonów WordPress

Tagi warunkowe to świetny sposób na dodanie małe zmiany do szablonów stron. Oczywiście można tworzyć większe modyfikacje w oparciu o kilka instrukcji warunkowych. Uważam to rozwiązanie za bardzo kłopotliwe i niewygodne, dlatego zamiast tego zdecydowałbym się na tworzenie niestandardowych szablonów.

Jednym ze sposobów, aby to zrobić, jest użycie hierarchii szablonów WordPress. Jak już widzieliśmy, WordPress przejrzy listę wszystkich możliwe szablony i wybierz pierwszy szablon pasujący do żądanej strony. W przypadku stron hierarchia wygląda następująco:

• Niestandardowe szablony stron
• strona-(ślimak).php
• strona-(id).php
• strona.php
• indeks.php

Najpierw pojawiają się dowolne szablony stron, które zostały bezpośrednio przypisane do tej strony. Jeśli istnieje co najmniej jeden taki szablon, WordPress użyje go niezależnie od istnienia innych szablonów. O niestandardowych szablonach stron porozmawiamy później.

WordPress następnie poszuka szablonu strony zawierającego błąd dla danej strony. Na przykład, jeśli do plików motywu dołączysz plik page-about.php, WordPress użyje tego pliku do wyświetlenia Twojej strony Informacje lub dowolnej innej strony znajdującej się pod adresem http://www.yoursite.com/about .

To samo możesz osiągnąć, podając identyfikator swojej strony. Na przykład, jeśli ta sama strona ma identyfikator 5, WordPress użyje szablonu page-5.php, jeśli istnieje; Stanie się tak tylko wtedy, gdy w hierarchii nie będzie żadnych szablonów stron o wyższym priorytecie.

Możesz znaleźć identyfikator dowolnej strony, po prostu najeżdżając kursorem na jej tytuł w sekcji Wszystkie strony zaplecza WordPress. Identyfikator będzie znajdował się w linku wyświetlanym przez Twoją przeglądarkę.

Łączenie niestandardowych szablonów stron

Oprócz szablonów, z których WordPress może korzystać automatycznie, zawsze możesz powiązać z szablonami niestandardowymi różne strony. Jak zapewne wiesz z hierarchii szablonów, szablony niestandardowe mają najwyższy priorytet.

Podobnie jak w przypadku łączenia szablonów z określonymi stronami, musisz utworzyć szablon i połączyć go ze stroną, do której planujesz go używać. To drugie można wykonać na dwa sposoby, które być może już znasz. Na wszelki wypadek pokażemy Ci, jak to zrobić.

Łączenie niestandardowego szablonu strony za pomocą edytora WordPress

W Edytor WordPressa możesz znaleźć pole o nazwie Atrybuty strony. Zawiera listę szablonów.

Możesz wybrać z tej listy dowolne dostępne Szablony WordPressa. Po prostu wybierz odpowiedni szablon, a następnie zapisz lub odśwież stronę.

Ustawianie niestandardowego szablonu poprzez szybką edycję

To samo można zrobić bez wchodzenia do edytora WordPress. Przejdź do sekcji Wszystkie strony i najedź kursorem myszy na dowolny element listy. Na ekranie pojawi się menu zawierające opcję szybkiej edycji.

Kliknij tę pozycję, aby edytować parametry strony bezpośrednio z listy. Zobaczysz to samo menu rozwijane, w którym możesz wybrać szablon strony. Wybierz szablon i zaktualizuj stronę. Gotowy.

Nie takie trudne, prawda? Co jednak, jeśli nie masz jeszcze niestandardowego szablonu strony? Jak to stworzyć? Nie martw się, omówimy to w następnej sekcji.

Przewodnik krok po kroku dotyczący tworzenia niestandardowych szablonów stron

Tworzenie niestandardowych szablonów stron nie jest skomplikowanym procesem, ale należy wziąć pod uwagę kilka szczegółów. Przyjrzyjmy się temu procesowi krok po kroku.

1. Szukamy standardowego szablonu.

Dobrym sposobem na rozpoczęcie tworzenia niestandardowego szablonu strony jest skopiowanie istniejącego szablonu ten moment już użyty dla wymaganej strony w Twoim motywie. Już łatwiej to zmienić istniejący kod niż pisanie całej strony od zera. W większości przypadków będzie to plik page.php.

Jeśli nie jesteś w stanie określić, który szablon jest używany na danej stronie, możesz skorzystać z wtyczki What The File.

Jako przykład użyję motywu Twenty Twelve. Tak wygląda w nim standardowy szablon strony:

Jak widać nic ciekawego: regularne połączenia nagłówka i stopki, a także pętlę pośrodku. Strona będzie wyglądać następująco:

1. Skopiuj i zmień nazwę szablonu

Po zdefiniowaniu standardowy szablon będziemy musieli go skopiować. Duplikat wykorzystamy do wprowadzenia niezbędnych zmian na naszej stronie. Będziemy musieli także zmienić jego nazwę.

Możesz nazwać plik jak chcesz. Najważniejsze jest to, że nie zaczyna się od zarezerwowanych nazw plików motywu. Nie powinieneś nazywać pliku page-coś.php lub czegoś podobnego, ponieważ WordPress pomyśli, że jest to niestandardowy szablon.

Najlepiej nazwać plik tak, aby oddawał istotę szablonu. Na przykład mój-niestandardowy-template.php. W naszym przypadku nazwiemy go niestandardowym plikiem-full-width.php.

1. Zmiana tytułu szablonu

Teraz musimy powiedzieć WordPressowi, że to nowy plik to niestandardowy szablon strony. Aby to zrobić, po prostu dostosujemy nagłówek pliku:

Nazwa szablonu pojawi się w sekcji Atrybuty strony na stronie edytora WordPress. Upewnij się, że zmieniłeś go na swój własny.

1. Konfigurowanie kodu.

Teraz czas na pracę z kodem szablonu. W naszym przykładzie usuniemy pasek boczny ze strony demonstracyjnej.

Jest to stosunkowo łatwe do zrobienia - po prostu usuń get_sidebar(); z szablonu strony. W rezultacie mój szablon wyglądał następująco:

1. Ładowanie szablonu strony

Po zapisaniu zmodyfikowanego pliku musimy wgrać go na stronę. Niestandardowe szablony stron można przechowywać w różnych miejscach:

• Folder z Twoim aktywnym (podrzędnym) motywem
• Folder z głównym motywem nadrzędnym
• Podfolder w folderze z dowolnym motywem (zarówno nadrzędnym, jak i podrzędnym)

Wolę utworzyć folder page_templates w motyw dziecięcy i umieść w nim wszystkie dowolne szablony. To dla mnie najłatwiejszy sposób uzyskania dostępu do zmienionych plików.

1. Aktywacja szablonu

Ostatni krok: musimy aktywować szablon strony. Jak wspomniano wcześniej, odbywa się to w sekcji Atrybuty strony → Szablony edytora WordPress. Zapisujemy, przeglądamy stronę - i widzimy nasze nowy szablon w akcji (bez paska bocznego):

Nie takie trudne, prawda? Nie martw się, w mgnieniu oka będziesz mógł udoskonalić swoje umiejętności tworzenia szablonów. Aby dać Ci wyobrażenie o tym, jak dokładnie można wykorzystać te szablony, pokażę Ci kilka interesujących przypadków użycia.

Pięć różnych sposobów korzystania z szablonów stron

Jak wspomniano wcześniej, szablony stron mogą być wykorzystywane do różnych celów. Możesz dostosować prawie każdy obszar na dowolnej stronie. Jedyną przeszkodą na tej drodze będzie Twoja wyobraźnia (i umiejętności kodowania).

Szablon do wyświetlania stron na całej szerokości ekranu

Pierwszym przypadkiem, któremu się przyjrzymy, jest rozszerzona wersja szablonu demonstracyjnego, który stworzyliśmy powyżej. Usunęliśmy już pasek boczny, usuwając funkcję get_sidebar(); z kodu. Jednakże, jak widać na zrzucie ekranu, strona nadal nie wyświetlała się na całej szerokości ekranu, ponieważ sekcja treści pozostała wyrównana do lewej.

Aby to naprawić, musimy popracować z CSS, szczególnie w tej sekcji:

Zawartość witryny ( float: lewy; szerokość: 65,1042%; )

Atrybut szerokości ustawia szerokość naszej zawartości na 65,1042% dostępnego miejsca. Chcemy zwiększyć tę wartość.

Jeśli po prostu zmienimy wartość szerokości na 100%, to ostatecznie wszystkie strony naszej witryny będą wyświetlane na pełnej szerokości ekranu - nie jest nam to potrzebne. Naszym pierwszym krokiem jest zmiana klasy elementu div za pomocą id=primary w naszym niestandardowym szablonie. Możesz go zmienić na class="site-content-fullwidth". Wynik:

Teraz możemy dostosować CSS dla naszej niestandardowej klasy:

Pełna szerokość zawartości witryny ( float: lewy; szerokość: 100%; )

W rezultacie treść zajmie cały ekran:

Dynamiczne strony 404 z obszarami widżetów

Strona 404 pojawia się, gdy użytkownik próbuje uzyskać dostęp do strony w Twojej witrynie, która nie istnieje. Dzieje się tak na skutek literówki, nieprawidłowego linku lub zmiany bezpośredniego linku do strony.

Choć nikt nie lubi otrzymywać 404 stron, to jednak grają ważna rola dla Twojej witryny. Ich treść często decyduje o tym, czy dana osoba natychmiast opuści Twoją witrynę, czy będzie próbowała szukać na niej innych treści.

Napisanie od zera 404 stron jest dość trudnym procesem, szczególnie jeśli nie masz dużego doświadczenia. Najlepiej osadzić w swoim szablonie obszary widżetów, aby móc elastycznie zmieniać treść wyświetlaną na ekranie.

Specjalnie do tego użyjemy pliku 404.php dołączonego do motywu Twenty Twelve (pamiętasz hierarchię szablonów?). Zanim jednak cokolwiek w nim zmienimy, twórzmy nowy widżet wklejając kod do plikufunctions.php:

Register_sidebar(array("name" => "Strona 404", "id" => "404", "description" => __("Tutaj znajduje się treść strony błędu 404."), "before_widget" => "

", "po_tytułie" => "

Spowoduje to wyświetlenie naszego nowego widgetu w zapleczu WordPress. Aby mieć pewność, że rzeczywiście pojawi się na naszej stronie, musimy dodać następna linia kod do pliku strony 404 w odpowiednim miejscu:

W moim przypadku chcę zastąpić formularz wyszukiwania funkcją get_search_form(); w szablonie do obszaru widżetów. Oto jak to wygląda:

Po wgraniu szablonu na stronę możemy wypełnić nowy obszar widżetu:

Jeśli teraz przejdziemy na stronę 404, zobaczymy nowe widżety:

Szablon strony do wyświetlania niestandardowych typów postów

Niestandardowe typy postów to świetny sposób na prezentowanie treści, które mają własne zestawy danych, projekt i inne ustawienia. Popularnym przypadkiem użycia tego typu postów są elementy recenzji: książki, filmy itp. W naszym przypadku chcemy stworzyć szablon strony, który będzie wyświetlał pozycje portfolio.

Najpierw musimy utworzyć nasz niestandardowy typ postu. Można to zrobić ręcznie lub za pomocą wtyczki. Mogę polecić do tego wtyczkę Types. Umożliwi to łatwe tworzenie niestandardowych typów postów i niestandardowych pól.

Zainstaluj i aktywuj Types, dodaj niestandardowy typ postu, zmień go w „portfolio”, skonfiguruj wymagane pola (na przykład dodając miniaturę), dostosuj inne opcje i zapisz.

Teraz, gdy mamy już typ postu portfolio, musimy go wyświetlić na stronie. Pierwszą rzeczą, którą zrobimy, będzie stworzenie żądaną stronę. Pamiętaj, że jeśli wybrałeś portfolio jako ślimak dla swojego dowolny typ rekordy, strona nie powinna mieć tego samego ślimaka. Zdecydowałem się na portfolio klientów i dodałem trochę dodatkowego tekstu.

Po dodaniu kilku elementów do sekcji portfolio należy je wyświetlić na stronie zaraz po głównej treści.

W tym celu używamy duplikatu page.php. Skopiujmy plik, nazwijmy go portfolio-template.php i zmieńmy jego tytuł:

Jednak w tym przypadku będziemy musieli dokonać pewnych zmian w oryginalnym szablonie. Jeśli spojrzysz na kod page.php, zobaczysz, że wywołuje on inny szablon, content-page.php (get_template_part('content', 'page');). W tym pliku będziemy potrzebować następującego kodu:

Jak widać, tutaj nazywany jest tytuł i treść strony. Ponieważ potrzebujemy ich również w sekcji portfolio, skopiujemy te fragmenty do naszego szablonu page.php. Wynik będzie następujący:

Pobierz_nagłówek(); ?>

Aby wyświetlić elementy portfolio na naszej stronie, będziemy musieli dodać następujący kod zaraz po wywołaniu funkcji the_content():

"portfolio", // wprowadź niestandardowy typ postu "orderby" => "data", "zamówienie" => "DESC",); $loop = nowy WP_Query($args); if($loop->have_posts()): while($loop->have_posts()): $loop->

W rezultacie na naszej stronie wyświetli się niestandardowy typ postu:

Nie wygląda to zbyt ładnie, więc dodajmy tutaj trochę stylizacji:

/* Posty w portfolio */ .portfolio ( -webkit-box-shadow: 0px 2px 2px 2px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0,75); box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0,75); margines: 0 0 20px; dopełnienie: 30px; ) .portfolio-image ( display: block; float: left; margines: 0 10px 0 0; max-width: 20%; ) .portfolio-image img ( border-radius: 0; ) .portfolio-work ( display: inline-block; max-width: 80%; ) .portfolio h3( border-bottom : 1px solid #999; rozmiar czcionki: 1,57143rem; waga czcionki: normalna; margines: 0 0 15px; dopełnienie: 15px; )

Teraz jest dużo lepiej, nie sądzisz?

Oto cały kod szablonu strony portfolio:

Strona członków z awatarami

Kolejnym przykładem wykorzystania naszego szablonu jest strona członków. Chcemy wyświetlić listę autorów naszej witryny, łącznie z ich zdjęciami, a także liczbą postów, które opublikowali pod swoim nazwiskiem. Wynik końcowy będzie następujący:

Zaczniemy od tego samego pliku hybrydowego co poprzednio i dodamy do niego kod wyświetlający listę uczestników.

Domyślny motyw Twenty Fourteen zawiera domyślną stronę członków. Możesz znaleźć ten szablon w folderze page-templates o nazwie contributors.php.

Jeśli jednak zajrzysz do tego pliku, znajdziesz tylko następujące wywołanie: dwadzieściafourteen_list_authors();. Najwyraźniej jest to powiązane z funkcją zawartą w pliku Function.php motywu. Nas interesuje następujący fragment:

"ID", "orderby" => "post_count", "order" => "DESC", "who" => "autorzy",)); foreach ($contributor_ids jako $contributor_id): $post_count = count_user_posts($contributor_id); // Przejdź dalej, jeśli użytkownik nie opublikował jeszcze postu. if (! $post_count) (kontynuuj; ) ?>

Dodamy go tuż pod wywołaniem funkcji the_content() i otrzymamy następujący wynik:

Teraz ustalmy trochę stylizacji:

/* Strona dostawcy */ .contributor ( border-bottom: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box- rozmiar: obramowanie; wyświetlacz: blok inline; dopełnienie: 48px 10px; ) .contributor p ( margines na dole: 1rem; ) .contributor-info ( margines: 0 auto 0 168px; ) .contributor-avatar ( obramowanie: 1px solid rgba(0, 0, 0, 0.1); float: lewy; wysokość linii: 0; margines: 0 30px 0 -168px; dopełnienie: 2px; ) .contributor-avatar img( border-promień: 0; ) .contributor -summary ( float: lewy; ) .contributor-name( czcionka: normalna; margines: 0 !important; ) .contributor-posts-link ( kolor tła: #24890d; obramowanie: 0 brak; promień obramowania: 0 ; kolor: #fff; wyświetlacz: blok inline; rozmiar czcionki: 12 pikseli; grubość czcionki: 700; wysokość linii: normalna; dopełnienie: 10 pikseli 30 pikseli 11 pikseli; transformacja tekstu: wielkie litery; wyrównanie do pionu: dół; ) . Contributor-posts-link:hover ( kolor: #000; dekoracja tekstu: brak; )

Gotowy. Dziękuję Dwadzieścia Czternaście!

Zmieniona strona archiwum

Twenty Twelve ma swoje własne własny szablon dla stron archiwalnych. Zostanie wykorzystany np. przy próbie przeglądania wcześniejszych postów z określonej kategorii.

Chciałbym jednak zrobić coś ciekawszego, np. Problogger: stronę, która pozwala ludziom uzyskać dodatkową treść różne sposoby. Odbywa się to ponownie za pomocą szablonu strony.

Możemy dodać następujący kod tuż pod the_content() w naszym pliku, który jest używany w przykładach:

Archiwa według roku:

Archiwa według miesięcy:

Archiwa według tematu:

Będziesz także potrzebować stylizacji do wyszukiwania:

Formularz wyszukiwania archiwum ( dopełnienie: 10px 0; wyrównanie tekstu: do środka; )

Wynik będzie następujący:

Oto cały plik, abyś mógł zrozumieć, co jest co:

Nie zapomnij połączyć tego szablonu ze stroną!

Czasami przydatne jest ukrycie i/lub pokazanie niektórych treści w postach/ Strony WordPressa w zależności od określonych warunków. Warunki i sytuacje są różne. Załóżmy, że organizujesz konkurs w swojej witrynie i warunki konkursu lub jego wyniki powinny automatycznie pojawić się w witrynie 17 dnia bieżącego miesiąca. Lub rozpowszechniasz linki w swojej witrynie, ale nie chcesz, aby wszyscy je widzieli, a jedynie zarejestrowani użytkownicy witryny. Lub akceptujesz na stronie ankiety od odbiorców, ale chcesz, aby ankieta była wyświetlana na stronie tylko od 1 do 10 każdego miesiąca... Itd.

Oczywiście istnieje wiele wtyczek zarządzających treścią WordPress. Nie jest jasne, czy spełniają wszystkie wymagane sytuacje. Ale zrobienie tego samemu (bez użycia wtyczek) nie jest takie trudne. Wykorzystamy shortcodes – prosty zestaw funkcji służących do tworzenia i wykorzystywania makrokodów w treści postów/stron. Zakodujemy trochę typowe sytuacje Na ich podstawie możesz stworzyć własną funkcję specjalną.

W każdej sytuacji będziemy potrzebować funkcji krótkiego kodu, zwykle jest ona wstawiana do pliku funkcje.php aktualny temat i przykład bezpośredniego użycia w treści wpisu/strony.

Treść widoczna jest tylko dla zarejestrowanych użytkowników

Część treści na stronie można ukryć przed niezarejestrowanymi użytkownikami (oczywiście roboty też ich nie zobaczą Wyszukiwarki). Zwykle ukrywają: linki do pobrania pliku, odpowiedź na pytanie, resztę treści (w celu zmotywowania użytkowników do rejestracji itp.).

Funkcja logowana_in_użytkownika_content($atts, $content = null) ( if (is_user_logged_in() && !is_null($content) && !is_feed()) ( return $content; ) return "Dostępne tylko dla zarejestrowanych użytkowników"; ) add_shortcode("widoczny ", "zalogowana_zawartość_użytkownika");

Tylko zarejestrowani użytkownicy zobaczą ten tekst. Zostanie również wykluczony z wyszukiwania.

Widoczność treści w zależności od roli użytkownika w serwisie

Zarejestrowani użytkownicy również mają różne role(). Możesz zarządzać treścią w swojej witrynie, jeśli zastosujesz gradację dostępu użytkowników do swojej witryny:

Funkcja content_by_user($attr, $content = null) ( $defaults = array("capability" => ""); ekstrakt(shortcode_atts($defaults, $attr)); if (current_user_can($capability) && !is_null($ treść) && !is_feed()) ( return $content; ) return "Nie masz wystarczających uprawnień"; ) add_shortcode("rolecontent", content_by_user");

Użycie w treści posta/strony:

Ta część treści jest widoczna dla użytkowników posiadających odpowiednie uprawnienia w serwisie.

Możesz skorzystać z następujących opcji:

• Czytać- treść będzie widoczna dla wszystkich
• edycja_postów- widoczne dla redaktorów
• zarządzaj opcjami- tylko dla administratorów

Widoczność treści w zakresie dat każdego miesiąca

Jeśli chcesz to zrobić widoczna część treści w określonym zakresie dat każdego miesiąca (powiedzmy od 1 do 10), możesz użyć tego krótkiego kodu:

Funkcja content_countdown($atts, $content = null)( ekstrakt(shortcode_atts(array("ot" => "", "do" => ""), $atts)); $dt=data("j"); if ($dt>=$ot && $dt<=$do) { return $content; } } add_shortcode("data", "content_countdown");

Użycie w treści posta/strony:

Pokazujemy użytkownikom, co będzie dostępne tylko od 1 do 10 (włącznie) każdego miesiąca.

Widoczność treści w określonym dniu miesiąca

Może się to przydać, jeśli np. 30 dnia każdego miesiąca podsumujesz jakieś wyniki. Odbywa się to w taki sam sposób, jak w poprzednim przypadku, z pewnymi modyfikacjami:

Funkcja content_countdown_data($atts, $content = null)( ekstrakt(shortcode_atts(array("chislo" => ""), $atts)); $dt=data("j"); if ($dt==$chislo ) (zwróć $content; ) ) add_shortcode("dane", "content_countdown_data");

Użycie w treści posta/strony:

Ta treść będzie dostępne dla użytkowników dopiero 30-go każdego miesiąca.

Widoczność treści w konkretnym dniu tygodnia

Treść można ukryć/pokazać w określonym dniu tygodnia (poniedziałek, wtorek itp.)

Funkcja content_countdown_w($atts, $content = null)( ekstrakt(shortcode_atts(array("chislo" => ""), $atts)); $dt=data("w"); if ($dt==$chislo ) (zwróć $treść; ) ) add_shortcode("tydzień", "content_countdown_w");

Użycie w treści posta/strony:

Widoczność treści tylko w określonym miesiącu roku

Aby wyświetlić treści na Twojej stronie w osobnym miesiącu roku (nie jestem pewien, czy komukolwiek to potrzebne, ale jednak), używamy następującego shortcode:

Funkcja content_countdown_month($atts, $content = null)( ekstrakt(shortcode_atts(array("miesiąc" => ""), $atts)); $dt=data("n"); if ($dt==$miesiąc ) (zwróć $treść; ) ) add_shortcode("miesiąc", "content_countdown_month");

Użycie w treści posta/strony:

Ta zawartość będzie dostępna dla użytkowników dopiero w styczniu. Podaj liczbę: od 1 do 12.

Widoczność treści w różnych miesiącach

Co się stanie, jeśli chcesz pokazywać/ukrywać treści tylko latem lub zimą? Albo w pierwszym kwartale roku? Możemy stworzyć taki krótki kod:

Funkcja content_countdown_months($atts, $content = null)( ekstrakt(shortcode_atts(array("ot" => "", "do" => ""), $atts)); $dt=data("n"); if ($dt>=$ot && $dt<=$do) { return $content; } } add_shortcode("months", "content_countdown_months");

Użycie w treści posta/strony:

Treść będzie dostępna tylko w pierwszym kwartale roku, od miesięcy 1 do 3 (włącznie).

Widoczność treści po dacie

Możesz ukryć treści, które odwiedzający Twoją witrynę zobaczą dopiero po upływie określonej daty. Taki kod będzie potrzebny do informowania o nadejściu Nowego Roku, zakończeniu zawodów, maratonie na stronie itp.

Funkcja content_countdown_day($atts, $content = null)( ekstrakt(shortcode_atts(array("month" => "", "day" => "", "rok" => ""), $atts)); $remain = ceil((mktime(0,0,0,(int)$miesiąc,(int)$dzień,(int)$rok) - time())/86400); if($remain > 1)( return $remain dni = „Pozostało dni - ($pozostało)"; ) else if($remain == 1)( return $daysremain = "Pozostałe 1 dzień"; ) else( return $content; ) ) add_shortcode("nowy rok", "content_countdown_day");

Użycie w treści posta/strony:

Nowy Rok! Świętujmy!

Jeśli krótkie kody w krótkim kodzie nie działają

Wszystkie powyższe skróty mają na celu ukrycie/pokazanie części kodu HTML na Twoich stronach. Ale co się stanie, jeśli umieścisz krótki kod w krótkim kodzie? Zgadza się, zagnieżdżony krótki kod nie będzie działać. Ten konflikt wystąpi na przykład, jeśli spróbujesz osadzić krótki kod Formularz kontaktowy, na przykład tak:

[contact-form-7 id="6122" title="Formularz kontaktowy"] !}

Aby krótki kod działał Krótki kod WordPressa musimy zastąpić tylko jedną linię w funkcjach podanych tutaj skrótów. Linia:

Zwróć zawartość $;

zastąpione przez:

Zwróć do_shortcode($treść);

Wszystko powinno działać!