Miesiąc: Październik 2016

Ciekawe i pożyteczne linki

1. Codex WP-link oficjalnego serwisu poświeconego WP 2.Tutorial Allessandro Castellani – podstawy tworzenia templatek WP. Dość dobry materiał pokazujący jak stworzyć pierwszy prosty motyw WP. Filmy tutoriala są w języku angielskim, potrzebna conajmniej podstawowa znajomość php i css. 3.Tutorial Allessandro Castelani- Tutorial na yt na temat tworzenia złożonego komercyjnego motywu WP opartego na Bootstrap. 4.Polski […]

formularz kontaktowy

7.Definicja formularza w tagu form, określenie jego id. 11. W tym divie są informacje dotyczące labelki i przynależące do niej pola input 12.col-sm-4 control-label- dla urządzeń mobilnych labelka będzie miała szerokość 4 kolumn, nadanie klasy lementowu control-label dla stylizacji labelki na bootstrap. Reszta kodu się powtarza.

mapa

Kod dla tej sekcji jest zbieżny z sąsiadującymi sekcjami. Sama mapa wyświetla się za pomocą wtyczki którą przerobiłem na wersje z interfejsem dla usera z wersji Simple Google Maps Shortcode Pipina Wiliamsa. Wtyczkę tą opiszę w dziale poświęconym wtyczkom.

segment restauracje

kod restauracje omowienie kodu 1. Ustawienie kontenera z marginesem top ( górny wierzchołek z sąsiadującym elementem) 3. Stworzenie panelu bootstrapa 4. Nagłówek panelu wraz jego właściwościami,get_post_archive_link- pozyskanie linku do archiwum postów 9. W divie tym przechowywany jest właściwy kontent panelu. 11. Ustawienie jednej kolumny o szerokości 4 jednostek ( 4 kolumn). 12. Ustawienie jednego z […]

carousel- karuzela czyli slider

Czym jest karuzela w Bootstrap? Karuzela jest inaczej sliderem wbudowanym w ten framework. Można w niej prezentować treści w postaci tekstów i obrazów. 1.Wstawiamy blok karuzeli i nadajemy jej id. Id może być dowolne ale musi być identyczne w odpowiednich miejscach.Klasa karuzeli slide będzie odpowiadać za jej responsywność. 2-6. Generowanie trzech kropek slidera będącymi jednocześnie […]

jumbotron

Co to jest jumbotron? Jumbotron jest częścią składową Bootstrap, jego głównym zadaniem jest skupienie uwagi na danej akcji mającej miejsce na stronie. Na naszej stronie jest to przycisk „przepis dnia” wraz z podłączonym do niego łączem prowadzącym do treści tego przepisu. 1.Wstawiamy blok diva o klasie jumbotron. 3.Określamy wycentrowanie textu. 11.Zmienna będzie przechowywać tytuł konkretnego […]

klasa BootstrapNavMenuWalker

Wstęp do omówienia kodu. Aby dostosować i zintegrować menu WP z menu w stylu Bootstrap należy użyć wbudowanej klasy Walker_Nav_Menu. Odpowiada ona za dostosowanie wyglądu i zachowania oraz ogólnej specyfikacji menu w WP. Realizacja tego zagadnienia może być podejmowana w różnoraki sposób, przedstawiany tutaj jest tylko jednym z nich. Aby podejrzeć strukture menu najlepiej posłużyć […]

plik header i menu nawigacji

<pre><header> <div class=”container”> <div class=”row”> <div class=”col-md-12″> <nav class=”navbar navbar-inverse navbar-fixed-top” role=”navigation”> <div class=”container-fluid”> <div class=”navbar-header”> <button type=”button” class=”navbar-toggle” data-toggle=”collapse” data-target=”#myNavbar”> <span class=”sr-only”>Nawigacja strony</span> <span class=”icon-bar”></span> <span class=”icon-bar”></span> <span class=”icon-bar”></span> </button> <?php if (is_home() || is_front_page()) {?><!–jesli strona jest domowa lub frontowa–> <h1 id=”site-title”> <a href=”<?php echo home_url();?>” title=”<?php bloginfo( ‚name’ ); ?>”><!–zwrocenie nazwy szablonu […]

Szkielet ogólny Bootstrap – wprowadzenie

Ogólna budowa layoutu strony www opartej na Bootstrap składa się z kontenerów( container), wierszy(row) oraz ( kolumn). Wygląd poszczególnych elementów jest kształtowany poprzez wbudowane klasy css oraz identyfikatory( te z kolei często korelują z js). Nasz przykład będzie sie składał z czterech responsywnych kolumn. Pierwsza bedzie zawierała obrazek,druga tablice, trzecia paragraf tekstu, czwarta tekstw nagłówku […]