Jak zainstalować slider na stronie głównej WordPress. Instalowanie suwaka w nagłówku WordPress

Cześć przyjaciele! Jest potrzeba zainstaluj piękny suwak obrazu na swojej stronie internetowej? Jeśli tak, ta lekcja jest dla Ciebie. Opowiem w nim jak szybko (maksymalnie 5 minut!) i prosto zaprojektować funkcjonalny slider.

Niedostępne w WordPressie standardowe narzędzia, dzięki któremu mogliśmy zrealizować nasze plany. Dlatego do stworzenia slidera wykorzystamy możliwości wtyczki Metasuwak. To bezpłatne i niezwykle popularne rozszerzenie WordPress – pobrało je już ponad 800 tysięcy użytkowników.

Doskonały bonus dla rosyjskojęzycznych webmasterów - wtyczka jest pełna Lokalizacja rosyjska. Zacznijmy!

Algorytm instalacji suwaka obrazu w WordPress

Zainstaluj wtyczkę Metasuwak. Aktywuj to.
Przejdź do sekcji Metasuwak w menu panelu administracyjnego (po lewej).
Kliknij znak „+”.
Kliknij Dodaj slajd.Prześlij z komputera lub wybierz Galeria multimediów zdjęcia do slidera.
Dodaj żądany link i opis slajdu.
Dostosuj suwak korzystając z narzędzi znajdujących się w menu bocznym (po prawej). Nie będę opisywał opcji – są zrusyfikowane, intuicyjne i proste. Zwrócę tylko uwagę, że oprócz standardowego zestawu ustawień (efekty, wygląd, rozmiar slidera) do wyboru są cztery opcje sliderów (R. Slides, Flex Slider, Coin Slider i Nivo Slider). Po zakończeniu ustawień kliknij Ratować.
Skopiuj ten znajdujący się na dole strony krótki kod suwaka i wklej go na żądaną stronę.
Za pomocą przycisku możesz dodać slider do strony internetowej (do wpisu lub strony). Dodaj suwak(wyświetlane w Edytorze postów (stron)).
Jeśli chcesz wstawić slider do szablonu użyj kodu znajdującego się w bloku Stosowanie na karcie Wstawianie do szablonu.

Dlaczego warto wiedzieć, jak rekrutować boty VK do grupy, jeśli dążysz do promocji w sieci społecznościowej - mówi o tym portal cenymm.com. Jak dużo i szybko zdobyć boty VKontakte - analiza różne sposoby. Dlaczego niewłaściwa promocja jest niebezpieczna dla grupy, jak znaleźć solidnego wykonawcę.

W wyniku działań podjętych w tej lekcji otrzymałem suwak, który wyglądał następująco:

Poświęciłem mniej niż pięć minut na konfigurowanie tego... instalacja slidera w WordPressie prosta obsługa, nie sądzisz? Jeśli Twoje „budowanie slajdów” nie idzie dobrze, opowiedz nam o swoich trudnościach w komentarzach. Razem pokonamy każdy problem!

Wielu użytkowników ma pytanie, jak upiększyć swoją witrynę i dodać pokaz slajdów WordPress do nagłówka witryny, do dowolnego wpisu w witrynie, do strony, a nawet do paska bocznego WordPress. Mówiłem ci, jak możesz to zrobić, korzystając ze zdjęć przesłanych do standardowej galerii WordPress. Dziś opowiem Ci jak wykorzystać wtyczkę TheThe Image Slider do stworzenia slidera lub pokazu slajdów WordPress na swoim blogu.

Zainstaluj i skonfiguruj wtyczkę slidera oraz pokaz slajdów TheThe Image Slider WordPress

Instalacja pokazu slajdów lub suwaka w nagłówku witryny, pasku bocznym, poście lub stronie Wordpress

Po wszystkich manipulacjach związanych z ładowaniem obrazów do suwaka kliknij Wyjście bezpieczeństwa, w ten sposób opuścisz ładowanie zdjęć i zostaniesz przeniesiony do menu głównego, w którym będziesz miał dowolną nazwę swojego pokazu slajdów lub slidera. Wyjdź także do menu ogólne Możesz kliknąć górną zakładkę. Suwaki i slajdy.

Teraz nauczyliśmy się tworzyć suwaki i przesyłać obrazy za pomocą wtyczki The Image Slider. Teraz musimy dowiedzieć się, jak wstawić suwak do nagłówka witryny.

W menu głównym wtyczki widzisz mniej więcej następujący obrazek, nazwy mogą się różnić:

Jak widać na obrazku, wtyczka sama generuje nazwę krótkiego kodu, którą można wstawić w niemal dowolnym miejscu pokazu slajdów na Twojej stronie. Krótki kod jest jednym z najlepsze sposoby wstawiając wtyczki lub hacki do WordPressa w treść Twojej witryny, ja cały czas korzystam z tej metody, Dalej napiszę jak się go używa.

Aby wstawić pokaz slajdów do postu, wpisu lub strony swojej witryny, użyj tego krótkiego kodu, po prostu wklej go do edytora, gdzie wartość nazwa będzie nazwą Twojego slidera, nie mylić z nazwami zdjęć.

Aby wstawić suwak do nagłówka swojej witryny, musisz mieć trochę wiedzy na temat umiejętności HTML i CSS, aby umieścić go piękniej i płynniej, podam prosty przykład wykorzystując motyw dwudziestu, standardową kompilację WordPress, najważniejsze jest tutaj zrozumienie zasady.

Weź plik nagłówek. php naszego szablonu i znajdź te linie, które odpowiadają za wyświetlenie nagłówka witryny, w szablonie, w którym używam kontenera < div > wyraźny identyfikator = „nagłówek”

< div id = "wrapper" class = "hfeed" >

< div id = "header" >

To właśnie w tym kontenerze będę umieszczał mój pokaz slajdów, który będzie wyświetlany na wszystkich stronach, ponieważ plik nagłówek. phpłączy się ze wszystkimi plikami szablonów.

Wtyczka posiada funkcję, którą możesz wykorzystać w dowolnym miejscu swojego szablonu, tę funkcję wsadzony w . php plik motywu do miejsca, w którym chcesz wyświetlić suwak, w naszym przypadku jest to po otwarciu kontenera identyfikator = „nagłówek”, wszystko wygląda tak:

< div id = "wrapper" >

< div id = "header" >if (function_exists("get_thethe_image_slider" ) ) (

Istnieją szablony, które domyślnie mają funkcje suwaka w nagłówku witryny. Jednak większość motywów WordPress nie obsługuje tej funkcji. W związku z tym, jeśli taka implementacja jest konieczna, musimy sami dodać kod lub skorzystać z dowolnych wtyczek.

Możemy też stworzyć obraz gif i ustawić go zamiast standardowego obrazka w nagłówku, jednak w przyszłości nie będziemy mieli możliwości administrowania takim „suwakiem” inaczej niż utworzenie nowego obrazka gif.

W tym artykule omówiono instalację specjalnej wtyczki umożliwiającej wyświetlanie suwaka w dowolnym miejscu witryny WordPress. Wtyczka wśród swoich głównych zalet nazywa się:

Możliwość zmiany rozmiaru suwaka;
Możliwość wstawienia dowolnego hiperłącza do każdego slajdu;
Możliwość dodania informacji tekstowych do każdego slajdu;
Wiele efektów przejścia między obrazami;
Obsługa nieograniczonej liczby suwaków;
Obsługuje do 20 slajdów na suwak.

Niestety wtyczka nie została przetłumaczona, ale korzystanie z niej nie sprawia żadnych trudności, wszystko jest intuicyjne nawet dla początkującego.

Po zainstalowaniu wtyczki w menu pojawi się nowa zakładka

Klikając na niego lewym przyciskiem myszy zostaniemy przeniesieni do menu suwaków, gdzie możemy tworzyć nowe suwaki, wyłączać stare, a także je edytować.

Ponieważ interesuje nas możliwość zainstalowania suwaka w nagłówku strony, musisz kliknąć przycisk Edytować istniejący slider lub nowo utworzony przez Ciebie. W menu Źródło obrazów ustaw wartość na Niestandardowe, w polu Slajdy ustaw liczbę slajdów potrzebnych w tym suwaku, po czym musisz zapisać ustawienia.

Następnie w menu Obraz niestandardowy 1, Obraz niestandardowy 2, Obraz niestandardowy 3 itp. w polu ImageURL wstaw link do wcześniej przygotowanego i przesłanego do serwisu obrazu i nie zapomnij kliknąć przycisku Zapisz ustawienia przycisk za każdym razem.

Procedura nie jest wcale skomplikowana i po jej zakończeniu przystępujemy bezpośrednio do instalacji suwaka w nagłówku szablonu Twojej witryny WordPress.

Do tego potrzebujemy kodu:

Powyższy kod należy zapisać w pliku nagłówkowym swojej witryny nagłówek.php, wybierając tam dla niego optymalne miejsce. Jednak najprawdopodobniej suwak nie będzie pasował dokładnie tak, jak chcesz. Dlatego konieczne jest skorzystanie z metody opisanej w jednym z poprzednich artykułów.

Jeśli po przeczytaniu tego materiału Jeśli masz jakieś pytania dotyczące działania wtyczki lub sposobu instalacji slidera, napisz w komentarzach, a wspólnie się z tym uporamy!

Cześć przyjaciele! Dzisiaj porozmawiamy o Jak zainstalować suwak obrazu w witrynie WordPress.Tworzenie i instalacja suwak jest bardzo prosty i zajmie nie więcej niż 5 minut.

Slider stworzymy za pomocą wtyczki Meta Slider, która z kolei jest jedną z najpopularniejszych bezpłatny wtyczki (więcej niż 500,000+ instalacje aktywne).

Podłącz całkowicie zrusyfikowany, co również jest znaczącym plusem.

A więc zaczynajmy!

1. Zainstaluj i aktywuj wtyczkę Meta Slider.

2. Po aktywacji wtyczki z panelu administracyjnego przejdź do „Metasuwak”.

3. Kliknij „znak plus”.

5. Teraz produkujemy to, co niezbędne ustawienia wtyczki, których, swoją drogą, jest całkiem sporo (co jest dobrą wiadomością).

Nie widzę sensu pisania o wszystkich ustawieniach, skoro są wszystkie całkowicie zrusyfikowany i nie powinno być co do nich żadnych pytań. Z wyjątkiem ustawienia standardowe rozmiar suwaka, efekty, wygląd itp. możesz również wybierz jeden z czterech typów suwaków(Elastyczny suwak, R. Slider, Nivo Slider, Coin Slider).

6. Po załadowaniu obrazów i ustawieniu suwaka pozostaje tylko najprościej jest dodać slider do strony.

Można to zrobić na trzy sposoby: używając zwykłego krótkiego kodu(jeśli chcesz dodać slajd do strony), wpisując kod do szablonu i korzystając z przycisku „Dodaj suwak”. Aby dodać slider do strony skopiuj kod z bloku "Stosowanie", i wklej go na dowolną stronę lub post.

Aby wstawić suwak do szablonu, przejdź do zakładki „Wstaw do szablonu”, skopiuj kod i dodaj go do pliku szablonu, w którym chcesz wyświetlić suwak.

Dodaj suwak do strony za pomocą przycisku „Dodaj suwak” najprostszy sposób. Kliknij przycisk, wybierz utworzony suwak i kliknij „Wstaw pokaz slajdów”.

W razie potrzeby możesz dodać suwak i do paska bocznego. Aby to zrobić, przejdź do Wygląd-> Widżety i korzystaj z widżetu „Metasuwak”.

To jest ostatni suwak:

Jak widać, nie ma absolutnie nic skomplikowanego! Dodatek suwak w WordPressie wystarczająco szybkie i łatwe zadanie. Jeśli masz jakieś pytania, śmiało pisz w komentarzach.

Cześć przyjaciele! Dzisiaj porozmawiamy o tym, jak zainstalować suwak obrazu w witrynie WordPress. Tworzenie i instalacja slidera jest bardzo prosta i zajmie nie więcej niż 5 minut. Jak zainstalować slider obrazu w WordPressie Slider stworzymy za pomocą wtyczki Meta Slider, która z kolei jest jedną z najpopularniejszych darmowych wtyczek (ponad 500 000 aktywnych instalacji). Wtyczka jest całkowicie zrusyfikowana, co również jest znaczącym plusem. A więc zaczynajmy! 1. Zainstaluj i aktywuj wtyczkę Meta Slider. 2. Po aktywacji wtyczki przejdź z panelu administracyjnego do zakładki „Meta Slider”. 3. Kliknij znak plus. 4. Następnie kliknij przycisk „Dodaj slajd” i załaduj (lub wybierz spośród już pobranych) obrazy do slajdu. Dodać…

Recenzja

Ocena lekcji na temat dodania slidera do strony

100

Zgadzam się, że suwak obrazu na stronie internetowej wygląda całkiem nieźle. Suwak włączony strona główna strona internetowa to nie tylko stylowy wygląd, ale także dobra zawartość informacyjna o tematyce Twojej witryny dla odwiedzających.

Slider stworzymy za pomocą popularnej wtyczki Meta Slider i przetestujemy jego działanie na motywie Twenty Sixteen.

Tworzenie slidera

Zatem po zainstalowaniu i aktywowaniu wtyczki w panelu administracyjnym pojawi się nowa pozycja menu Metasuwak, po kliknięciu zostaniesz przeniesiony do głównego okna suwaka.

Ponieważ nie utworzono żadnych slajdów, istnieje tylko jeden przycisk oznaczony „ Utwórz swój pierwszy pokaz slajdów" Po kliknięciu otworzy się pierwsze okno suwaka.

Utworzyłeś więc pusty suwak, który domyślnie ma nazwę Nowy suwak. Jeśli chcesz zmienić jego nazwę, możesz to zrobić klikając na zakładkę w lewym górnym rogu i wprowadzając nową nazwę.

Tak więc slider został utworzony, teraz pozostaje dodać do niego slajdy, co można zrobić klikając przycisk po prawej stronie Dodaj slajd. Po dodaniu wszystkich zdjęć okno będzie wyglądać następująco:

Przed opublikowaniem slidera w serwisie możesz zapoznać się z parametrami jakie oferuje wtyczka.

Pierwszą rzeczą, o której należy porozmawiać, jest usunięcie dowolnego slajdu. Aby to zrobić, najedź kursorem na obraz slajdu, gdzie pojawi się czerwona ikona kosza, i kliknij na niego.

Na stronie edytora suwaków możesz także określić jego rozmiar, efekt przełączania i wygląd.

Ponadto masz dostęp do dodatkowe ustawienia: rozciągnięcie suwaka do pełnej szerokości, wyrównanie do środka, automatyczne odtwarzanie slajdów, inteligentne przycinanie zdjęć, wyświetlanie slajdów w odwrotnej kolejności, czas przełączania slajdów, czas wyświetlania itp.

Dlatego po dodaniu wszystkich niezbędnych slajdów i ustawień należy kliknąć przycisk Ratować. W ten sposób utworzyłeś suwak zdjęć.

Wyświetlanie slidera na stronie internetowej

Teraz trzeba to pokazać na stronie internetowej. W tym celu wtyczka oferuje dwie możliwości: pokazanie suwaka na osobnej stronie lub wstawienie specjalnego kodu do szablonu motywu.

Aby wyświetlić na osobnej stronie, pierwszym krokiem jest utworzenie strony ( Strony -> Dodaj nowe), w którym wstaw specjalny krótki kod, który oferuje wtyczka. Widać to w oknie edycji slidera (w naszym przypadku jest to ).

Po opublikowaniu strony będziesz mógł zobaczyć na niej swój slider.

Aby wstawić suwak do motywu swojej witryny (pamiętaj, że używamy motywu Dwadzieścia szesnaście) musisz wprowadzić zmiany w plikach motywu. Aby to zrobić, powinieneś iść Wygląd -> Edytor, Wybierz temat Dwadzieścia szesnaście i na liście dostępnych plików motywu znajdź Nagłówek nagłówek.php.

Teraz znajdź linię w kodzie