Ända sedan vi startade det här projektet har vi alltid velat att det ska ha vår egen prägel, och det är därför den andra mallen vi använder på DesdeLinux skapades helt och hållet av oss.
Andra versioner följde, och även om vi kan köpa eller hyra vissa webbtjänster för att skapa våra designer, som de från EstudioDWeb.com , eller köpa färdiga mallar från ThemeForest.net , har vi alltid velat ha våra egna, anpassade till våra behov, och att besöka DesarrolloWeb.com kan vara till hjälp
Hur som helst, jag brinner för webbdesign och utveckling, och jag jobbar redan på det nya temat för DesdeLinux och jag ska visa er några skärmdumpar på hur det går.
Tanken är inte att komma ur det vi redan är anpassade till, så många element förblir desamma eller på liknande sätt. Jag börjar med hemsidan
Och så ser artiklarna ut:
Som ni ser blir det precis rätt för oss, och vi har inkluderat nya kortkoder för att skapa artiklarna.
Därför tänkte jag dela med mig av hur man skapar en av dem (den informationsbaserade) ifall man vill inkludera dem i sina WordPress- teman . Något i stil med det här:
Jag är inte expert på programmering med detta CMS, så jag kommer inte att försöka förklara varför och hur det fungerar på det här sättet, jag visar bara hur man gör det, punkt.
För att göra detta använder vi WordPress "schweiziska armékniv" , jag syftar på functions.php- filen som vi vanligtvis hittar i nästan alla teman.
Vad vi kommer att göra i den här filen är att lägga till strukturen för vår ShortCode och naturligtvis etiketten som visar den. Så låt oss komma till det.
Inside the Function.php
Inuti vår function.php-fil kommer det att finnas HTML-strukturen i ShortCode, men det är inte bara att sätta HTML-taggarna precis så. Vi skulle ha något så här:
// Info-infobox ($ atts, $ content = null, $ code = "") {$ return = ' '; $ retur. = $ innehåll; $ return. = ' '; returnera $ return; } // ShortCode add_shortcode ('info', 'infobox');
Härifrån förtydligar vi ett par saker. För det första, när vi använder två snedstreck kommenterar vi bort raden, därför är // Info bara en kommentar.
Funktionsnamnet, i det här fallet infoboxen, kan ändras till vad vi vill, men det måste matcha namnet vi använde på sista raden.
Exempelvis:
$ retur. = $ innehåll;
Variabeln $content , som är där innehållet vi lägger in i ShortCode-koden, returnerar ett nullvärde om vi inte lägger in något.
Nu är namnet på ShortCode det vi ställer in med:
add_shortcode( 'info', 'infobox' );
Där du kan ändra informationen till vad du vill. För att det ska se ut som i exemplet måste vi nu ange:
[ info ]Este será el ShortCode de ejemplo[ /info ]
Men naturligtvis utan mellanslag, vilket jag satte för att naturligtvis ShortCode skulle aktiveras.
ShortCode-stil
Om du tittar på raden ovan, utan PHP-koden och variablerna, skulle ShortCode i ren HTML se ut så här:
<div class="alert-info"></div>
Så vi behöver bara tillämpa CSS-stilen.
.alert.alert-info {background: # d9edf7 url (info.png) no-repeat 7px 50%; gränsradie: 4 pixlar; border: 1px solid # bce8f1; färg: # 3a87ad; teckenstorlek: 14 pixlar; marginal: 15px 15px; stoppning: 15px 15px 15px 50px textjustering: vänster}
Och det är allt... Jag upprepar, jag är ingen programmerare eller något liknande, och förklaringen jag har gett är hur jag förstår ShortCode fungerar