Po několika letech (nebo dokonce měsících) navrhování a rozvíjení tém aplikací WordPress, zejména pro klienty, si začnete uvědomovat, že spoustu funkčnosti lze standardizovat nebo oddestilovat do "startovacího motivu nebo soupravy". To pomáhá rozvinout vývojový proces a pohybovat se rychle.
Nejlepším prvním krokem v tom, že jsem zjistil, je odstranit většinu běžných funkcí a zahrnout je do functions.php
. Tento functions.php
Soubor bude muset být rozšířen tak, aby vyhovoval potřebám konkrétních témat, neboť vzniknou nové projekty, ale poskytne více než úžasný výchozí bod pro vývoj.
Existuje zhruba 13 klíčových funkcí, které bych rád vybral a podle potřeby je přidá ...
Funkce navigačního menu, představená v aplikaci WordPress 3.0, umožňuje intuitivní vytváření a udržování navigačních menu v tématech.
Přinejmenším standardní téma bude potřebovat hlavní navigační menu, snad v záhlaví a sekundární navigační menu v zápatí. Za tímto účelem zaregistrujeme dvě nabídky "Hlavní menu" a "Sekundární menu"
Zatímco to není zvláště nová funkce, je stále příjemné ji zabalit do if function_exists()
jen v případě, že uživatel uvízne v instalaci před 3.0:
V functions.php
soubor, zadejte následující:
if ( function_exists( 'register_nav_menus' ) ) {register_nav_menus(array('main_menu' => __( 'Main Menu', 'cake' ),'secondary_menu' => __( 'Secondary Menu', 'cake' ),));}
Nyní, když jsou nabídky zaregistrovány, musíme sdělit téma, kde je můžeme vygenerovat. Chtěli bychom, aby se hlavní nabídka objevila v hlavičce. Takže v našem header.php
soubor, uvedeme následující kód:
'main_menu','menu' => '','container' => false,'echo' => true,'fallback_cb' => false,'items_wrap' => ' %3$s
','depth' => 0 );wp_nav_menu( $defaults );?>
Nejprve zkontrolujeme, jestli máme definované menu nazvané 'main_menu', a pokud to uděláme, vložíme jej zde, jinak se vrátíme do výchozího stavu wp_list_pages()
které můžeme dále přizpůsobit tak, aby zobrazovaly odkazy, jak potřebujeme.
Pokud chcete ještě další přizpůsobení nabídky, podívejte se na WordPress codex stránka na wp_nav_menu()
funkce.
Chceme, aby se sekundární nabídka objevila v zápatí, a proto ji otevřete footer.php
a zahrnout následující kód:
'secondary_menu','menu' => '','container' => false,'echo' => true,'fallback_cb' => false,'items_wrap' => ' %3$s
','depth' => 0 );wp_nav_menu( $defaults );?>
Tato funkce umožňuje použít vlastní CSS pro stylový editor WordPress TinyMCE.
Vytvořte soubor CSS s názvem editor-style.css
a vložte své styly uvnitř. Jako zástupný symbol bych chtěl začít ve stylu editor-style.css
souboru Twenty Twelve tématu.
V functions.php
přidejte následující:
add_editor_style();
Pokud nechcete pro soubor CSS používat název "editor stylu" a chcete přesunout soubor jinde, např. V adresáři css, změňte funkci.
Například chci pojmenovat svůj soubor tiny-mce-styles.css
a chci to v rámci svého adresáře CSS; tak moje funkce bude vypadat takto:
add_editor_style('/css/editor-style.css');
Zatímco jsme na tom, mohli bychom styl editoru pro jazyky zprava doleva. V adresáři témat vytvořte soubor CSS nazvaný editor-style-rtl.css
a přinejmenším zahrnovat následující:
html .mceContentBody {direction: rtl;unicode-bidi: embed;}li {margin: 0 24px 0 0;margin: 0 1.714285714rem 0 0;}dl {margin: 0 24px;margin: 0 1.714285714rem;}tr th {text-align: right;}td {padding: 6px 0 6px 10px;text-align: right;}.wp-caption {text-align: right;}
Opět, jako zástupný symbol, výše uvedené styly jsou z Twenty Twelve tématu. Restylovat a rozšířit podle potřeby.
Většina lidí, kteří komentují blogy online, má s nimi přidružený avatar. Pokud však nemáte a nemáte se jako výchozí možnosti avatarů WordPress, můžete definovat vlastní.
Chcete-li tak učinit, vložte do svého kódu následující kód functions.php
:
if ( !function_exists('cake_addgravatar') ) {function cake_addgravatar( $avatar_defaults ) {$myavatar = get_template_directory_uri() . '/images/avatar.png';$avatar_defaults[$myavatar] = 'avatar';return $avatar_defaults;} add_filter ('avatar_defaults', 'cake_addgravatar');}
To, co zde děláme nejdříve, kontroluje, zda funkce existuje. Pokud ano, přidáme filtr, který informuje aplikaci WordPress, že jako výchozí použije náš vlastní definovaný avatar.
Řekneme WordPress, že tento avatar najdete v našem adresáři "obrázky" v adresáři témat. Dalším krokem je samozřejmě vytvoření samotného obrázku a jeho nahrání do složky "images".
Funkce post formátů umožňuje přizpůsobit styl a prezentaci příspěvků. Od tohoto psaní existuje 9 standardizovaných formátů, které si uživatelé mohou vybrat z: stranou, galerií, odkazem, obrázkem, citací, stavem, videem, zvukem a chatováním. Kromě toho výchozí formát standardního formátu označuje, že pro konkrétní příspěvek není zadán žádný formát příspěvku.
Chcete-li přidat tuto funkci do vašeho tématu, vložte do svého kódu následující kód functions.php
, které specifikují formáty, které budete využívat. Například pokud chcete pouze stranou, obrázkem, odkazem, nabídkou a stavem Post formáty, měl by váš kód vypadat takto:
add_theme_support( 'post-formats', array( 'aside', 'image', 'link', 'quote', 'status' ) );
Funkce zobrazené fotografie, jako kód vysvětluje, umožňuje autorovi vybrat reprezentativní obrázek pro příspěvky, stránky nebo vlastní typy příspěvků.
Chcete-li tuto funkci aktivovat, vložte do svého kódu následující kód functions.php
:
add_theme_support( 'post-thumbnails' );
Mohli bychom se tam zastavit a nechat to na WordPress, abychom definovali velikost miniatur, nebo bychom mohli převzít kontrolu a definovat je sami. Uděláme to druhé, samozřejmě!
Řekněme, že provozujeme web časopisu, kde se doporučený snímek zobrazí alespoň v 3 různých velikostech. Možná jeden velký obrázek, je-li příspěvek zobrazen nebo je nejnovější, střední obrázek, pokud se jedná pouze o místo mezi ostatními a obvyklý rozměr se možná objeví jinde.
Využíváme add_image_size()
která instruuje WordPress, aby vytvořil kopii našeho vyobrazeného obrázku v definovaných velikostech.
Chcete-li to provést, přidáme následující příkazy functions.php
:
// regular sizeadd_image_size( 'regular', 400, 350, true );// medium sizeadd_image_size( 'medium', 650, 500, true );// large thumbnailsadd_image_size( 'large', 960, '' );
Podívejte se, jak pracovat s add_image_size()
funkce na měkké ořech nebo těžké oříznutí vaše obrázky na Stránka WordPress codex.
Poté, co jsme definovali výše uvedené velikosti snímků (pravidelné, střední a velké) - a protože ve výchozím nastavení WordPress to neudělá - přidáme možnost volby našich velikostí obrázků z rozhraní Nastavení zobrazení příloh .
Bylo by pěkné, kdybyste při psaní příspěvku vložili obrázek požadované velikosti výběrem z rozbalovacího seznamu, jak byste normálně používali pro výchozí formáty aplikace WordPress.
Za tímto účelem přidáváme následující informace functions.php
:
// show custom image sizes on when inserting mediafunction cake_show_image_sizes($sizes) {$sizes['regular'] = __( 'Our Regular Size', 'cake' );$sizes['medium'] = __( 'Our Medium Size', 'cake' );$sizes['large'] = __( 'Our Large Size', 'cake' );return $sizes;} add_filter ('image_size_names_choose', 'cake_show_image_sizes');
S tím, že na místě, můžeme vybrat naše velikosti obrazu.
To je jednoduché. Pokud jste na chvíli vytvářeli témata aplikace WordPress, budete si pamatovat dny, kdy jste museli ručně přidat kód pro výstup RSS kanálu přímo v header.php. Tento přístup je čistší a spoléhá se na wp_head()
akční háček pro výstup potřebného kódu.
V functions.php
soubor, zadejte následující:
// Adds RSS feed links to for posts and comments.add_theme_support( 'automatic-feed-links' );
Ujistěte se, že máte
it in the , right before end of header.php
it in the , right before end of &rgt;/head&lgt;
Pomocí této funkce provedete první krok směrem k tomu, aby vaše téma bylo k dispozici pro překlad.
Nejlepší je volat tuto funkci zevnitř after_setup_theme()
akční háček, tj. po spuštění nastavovacích, registračních a inicializačních akcí vašeho motivu.
add_action('after_setup_theme', 'my_theme_setup');function my_theme_setup(){load_theme_textdomain('my_theme', get_template_directory() . '/languages');}
Nyní přidejte adresář s názvem ' languages
'v adresáři motivů.
Další informace o funkci load_theme_textdomain () naleznete na stránce Stránka WordPress codex .
Šířka obsahu je funkce v tématech, která vám umožní nastavit maximální povolenou šířku pro videa, obrázky a další obsah oEmbed v motivu.
To znamená, že když vložíte adresu URL YouTube do editoru a aplikace WordPress automaticky zobrazí skutečné video na předním konci, toto video nepřesáhne šířku, kterou jste nastavili pomocí $content_width
proměnná.
if ( ! isset( $content_width ) )$content_width = 600;
WordPress také doporučuje přidat následující CSS:
.size-auto,.size-full,.size-large,.size-medium,.size-thumbnail {max-width: 100%;height: auto;}
Zatímco to je užitečné, jeho trochu těžké podání. Definuje šířku obsahu pro veškerý obsah. Co kdybyste chtěli videa o větší šířce na stránkách než v příspěvcích a ještě větší velikost v rámci vlastního typu příspěvku? V současné době neexistuje způsob, jak toto definovat. Existuje však a budoucí žádost navrhuje začlenění $content_width
variabilní do vestavěného add_theme_support()
.
Vaše typické téma bude mít alespoň jeden postranní panel. Kód pro definování postranního panelu je poměrně přímočarý.
Přidejte následující údaje k vašemu functions.php
:
if(function_exists('register_sidebar')){register_sidebar(array('name' => 'Main Sidebar','before_widget' => '','after_widget' => '','before_title' => '','after_title' => '
',));}
Toto registruje a definuje postranní panel s názvem "Hlavní postranní panel" a jeho značkou HTML.
Můžete se dozvědět více o register_sidebar()
funkce na stránce codex WordPress.
Obvykle zjistíte, že je třeba mít více než jeden postranní panel, abyste mohli kopírovat / vložit výše uvedený kód a změnit název.
Je tam také register_sidebars()
funkce, která vám umožní zaregistrovat a definovat více bočních panelů najednou, ale nedává vám flexibilitu, že každý nový postranní panel bude mít jedinečný název.
Pokud zobrazujete výňatky z příspěvků na indexové stránce blogu, zobrazí se ve výchozím nastavení aplikace WordPress [...]
aby se ukázalo, že je po "skoku" více.
Pravděpodobně budete chtít přidat "další odkaz" a definovat, jak vypadá.
K tomu je třeba přidat následující kód functions.php
:
function new_excerpt_more($more) {global $post;return '...
function cake_content_nav( $nav_id ) {global $wp_query;if ( $wp_query->max_num_pages > 1 ) : ?>
Pokud máte speciální návody ve vašem tématu, např. na stránce možností motivů, kterou chcete uživatel vidět při prvním aktivaci motivu, můžete je zde přesměrovat pomocí následující funkce:
if (is_admin() && isset($_GET['activated']) && $pagenow == "themes.php")wp_redirect('themes.php?page=themeoptions');
Zvláštní pozornost věnujte wp_redirect()
funkce. Nezapomeňte nahradit " themes.php?page=themeoptions
's adresou URL vaší stránky.
Během vývoje někdy najdu nástroj WordPress admin (tool) bar, který je docela rušivý.
Je v pevné poloze v horní části okna a v závislosti na mém uspořádání může pokrýt některé prvky záhlaví.
Zatímco se stále vyvíjím a rozvíjím, chtěla jsem tuto administrátorskou funkci skrýt.
show_admin_bar( false );
Máte nějaké oblíbené funkce pro spuštění WordPress šablony vývoj? Jaké funkce byste chtěli vidět? Dejte nám vědět v komentářích.
Doporučený snímek / náhled, obraz s více nástroji přes Shutterstock.