Maak een sjabloon voor WordPress is eenvoudiger dan je zou denken. Om dit te doen, hoeft u geen uitgebreide ervaring te hebben met het ontwerpen of programmeren van websites. In dit artikel zullen we het hebben over de basisprincipes van het helemaal opnieuw maken van uw eigen. WordPress-thema's.
Waarom zou het nodig kunnen zijn om te creëren eigen sjabloon WordPress, wanneer kan ik de beschikbare sjablonen in de database gebruiken? Hier volgen enkele redenen die daartoe aanleiding kunnen geven:
- U kunt een unieke website of landingspagina krijgen die anders is dan die van uw concurrenten. Gezien de miljoenen blogs die op dit CMS zijn gebouwd, wordt elk standaardontwerp minstens honderd keer gebruikt.
- Volledige vrijheid van handelen in de ontwikkelingsfase. Je kunt je eigen functionaliteit toevoegen met de werkelementen die je nodig hebt.
- U kunt voor verschillende delen van de site verschillende ontwerpen gebruiken, wat niet mogelijk is als u een kant-en-klaar sjabloon gebruikt.
- U kunt meerdere weergaven maken en bezoekers de mogelijkheid geven om hiertussen te schakelen verschillende onderwerpen, wat de interesse en loyaliteit voor de webbron zal vergroten.
- Het gemak van het werken met WordPress maakt het voor velen toegankelijk (videotutorials op internet zullen helpen). Dit betekent dat het ontwikkelen van een hoofdthema of het zelf maken van een subthema geld bespaart op het inhuren van externe ontwerpers en programmeurs.
- U kunt profiteren van de mogelijkheid van child-thema's - wanneer er aanpassingen worden gedaan aan tabelduplicaten stijlen stijl.css, terwijl het hoofdbestand onaangeroerd blijft. Hierdoor kunt u wijzigingen snel ongedaan maken als ze niet succesvol zijn, en ook geen werk verliezen bij het bijwerken van het hoofdthema.
Korte instructies
Natuurlijk kunt u niet volledig leren hoe u met slechts één artikel een paginasjabloon kunt maken. Om te beginnen is het belangrijk om de basisprincipes te begrijpen - hoe het beste eenvoudige thema's. Op basis daarvan kunt u al creatief aan de slag en een landingspagina of website maken volgens uw wensen. Nu geven we je een kort spiekbriefje met stap voor stap instructies– het zal u helpen begrijpen hoe een website wordt gemaakt.
Stap één: voorbereidend werk
Voordat u met het werk begint, moet u ervoor zorgen dat u dit heeft gedaan teksteditor(de eenvoudigste is Notepad of Nodepad++, vooral omdat je ze gratis kunt downloaden). De volgende stap is de installatie WordPress-motor en Denwer ging verder lokale computer. Denver is een pakket essentiële tools voor programmeurs. Met hun hulp wordt het proces van het ontwikkelen en aanpassen van websites aanzienlijk vergemakkelijkt en versneld. Deze video laat zien hoe je het installeert:
Stap twee: maak een nieuwe themamap
Laten we naar de gewenste map gaan. Meestal gaat het via het volgende pad: . Hier worden alle thema’s opgeslagen – zowel standaard als maatwerk. Laten we erop ingaan en het creëren nieuwe map. We noemen het bijvoorbeeld “MijnEersteTheme”.
Ga nu naar een nieuwe map en zorg ervoor dat u twee bestanden toevoegt die zijn gemaakt met Nodepad++ of een andere editor. Dit zijn index.php en style.css. Laat deze documenten voorlopig leeg blijven, dan gaan we ze invullen. Voeg ook de map afbeeldingen toe aan “MyFirstTheme”. waar u afbeeldingen kunt toevoegen om de sjabloon te versieren.
Vervolgens kunt u sjablonen toevoegen aan “MyFirstTheme” voor afzonderlijke onderdelen site: zijbalk (sidebar.php), site (header.php), berichten op pagina's (single.php), opmerkingen (comments.php), etc. Instellen extra bestanden hangt af van de structuur die u voor uw webbron plant.
Stap drie: index.php invullen
Het eerste dat u moet doen, is invullen indexbestand(index.php). Hier is een voorbeeld van de eenvoudige code, volgens welke de site vier gebieden zal hebben: koptekst, hoofdbalk, zijbalk en voettekst.
Sitetitel
In het bestand kunt u alle elementen registreren die u op uw website wilt zien. Meer informatie In de video kunt u leren over het schrijven van index.php-code om thema's in WordPress te maken:
Stap vier: vul style.css in
Nu moet je style.css openen, toevoegen en vullen volgende velden(in plaats van ***, voer uw eigen informatie over de site en de eigenaar in). De ingevoerde gegevens worden weergegeven in het beheerderspaneel.
/*Themanaam: ***
Thema-URI: http:// ***
Auteur-URI: http:// ***
Beschrijving: ***
Vervolgens is het mogelijk om in dit bestand verschillende gegevens en regels in te voeren die het uiterlijk van de pagina’s bepalen. Bijvoorbeeld:
(de informatie in /**/ is commentaar, geen delen van code)
Op in dit stadium Het is nog te vroeg om strikte stijlparameters in te stellen, maar verder werk met het bestand vindt u deze video-tutorial nuttig:
Stap vijf: splits de bestanden
Alle elementen gespecificeerd in index.php moeten in aparte bestanden worden gedupliceerd. In stap één werden in het voorbeeld naast het hoofdgedeelte ook de koptekst, de zijbalk en de voettekst gespecificeerd. Daarom maken we er onze eigen documenten voor in .php-formaat.
Maak bijvoorbeeld een bestand header.php en open index.php. zoek het overeenkomstige codegedeelte en plak het erin nieuw bestand. Het zal zijn:
Sitetitel
Hetzelfde wordt gedaan voor de overige onderdelen. Dit moet worden gedaan voor eenvoudiger navigatie. Als er veel elementen van de toekomstige site zijn, dan aparte bestanden helpt u beter te navigeren om te controleren of wijzigingen aan te brengen.
Om ervoor te zorgen dat het hoofdindexbestand consistent is met de aanvullende bestanden, moet het volgende in index.php onder de blokken voor elk onderdeel worden geschreven:
Hieronder vindt u een lijst standaard bestanden sjablonen gebruikt door WordPress. U hoeft ze niet te gebruiken of uw eigen secties toe te voegen:
- Koptekst – de stijl van de koptekst van uw site.
- Opmerkingen – sjabloon voor het maken van opmerkingen.
- Thuis – thema voor startpagina.
- Pagina — definieert het thema als u afzonderlijke pagina's op de site maakt
- Categorie – sjabloon voor het opsplitsen van categorieën
- Datum – definieert de datum-tijd weergavestijl.
- Archief – een sjabloon voor een archiefsectie met oud materiaal.
- Zoeken – een bestand dat parameters specificeert voor zoeken op de site.
- 404 is een sjabloon voor een pagina die een 404 Not Found-fout meldt.
- Voettekst – definieert de stijl van de voettekst van uw site.
Wanneer u vervolgens elk element verfijnt, heeft u een visuele video-tutorial nodig. Hier zijn een paar selecties die u kunnen helpen:
Koptekst in header.php:
Inhoud toevoegen:
Stylingopmerkingen:
Voettekst op de site:
Hoe u veilig wijzigingen kunt aanbrengen
Wanneer u wijzigingen moet aanbrengen in websitepagina's, bestaat het risico dat u iets verkeerd schrijft en dit niet kunt terugdraaien. Het kan ook voorkomen dat stylesheetbijdragen verdwijnen wanneer het hoofdthema wordt bijgewerkt.
Om dit te voorkomen, kunt u een onderliggend WordPress-thema (subthema) maken - dit is een duplicaat van het style.css-bestand dat geen invloed heeft op het hoofdbestand (wijzigingen in het ene bestand annuleren updates in het andere niet).
Het creëren van een dochteronderneming WordPress-thema's het zal niet moeilijk zijn. U moet een nieuwe map maken in de hoofdmap C:\WebServers\home\localhost\www\NAME_SET_DUR_INSTALL\wp-content\themes. In de nieuwe map maken we ons eigen style.css-bestand met de volgende inhoud:
Themanaam: TOPICNAAM
Sjabloon: MAPNAAM IN KINDTHEMA
Thema-URI: VUL IN
Omschrijving: VUL IN
Auteur-URI: VUL IN
/* importeer de stijlen van het hoofdthema */
@import-URL("../NAAM/stijl.css");
/* Je eigen aanvullende stijlen */
Foo(kleur: rood; )
Nu kunt u in het beheerderspaneel naar “Uiterlijk ›Thema’s” gaan en de onderliggende sjabloon activeren. In de toekomst kunt u in het nieuwe bestand werken. Daarnaast een korte videopresentatie over het onderwerp onderliggende sjablonen:
Alle secties van de sitesite
Wat is een thema + Aero aanpassen voor Windows 7
Het Windows 7-thema aanpassen
Wat is een thema?
Een thema is een samensmelting van computerbeelden, kleuren en geluiden. Het omvat de achtergrond bureaublad
, opstartscherm, kleur van vensterrand en geluidsschema.
Sommige thema's kunnen ook bureaubladpictogrammen en muisaanwijzers bevatten. Windows wordt geleverd met verschillende.
standaard thema's Je kunt kiezen Aero-thema om uw computer aan te passen, het thema “Windows 7 - vereenvoudigde stijl” als de computer langzaam draait, of een thema met hoog contrast
om de zichtbaarheid van elementen op het scherm te verbeteren.
Klik op een thema om het op uw bureaublad toe te passen.
Thema bevat bureaubladachtergrond, schermbeveiliging, kleur
ramen en geluiden.
Open het gedeelte 'Personalisatie'. Om dit te doen, klikt u op de Start-knop en selecteert u Configuratiescherm. Typ personalisatie in het zoekvak en klik vervolgens op Personalisatie.
U kunt de afbeeldingen, kleuren en geluiden ook afzonderlijk wijzigen om een aangepast thema te creëren. Zie hieronder voor meer informatie
Een thema voor Windows maken U kunt afzonderlijke delen van een thema (afbeeldingen, kleuren en geluiden) wijzigen en het gewijzigde thema vervolgens opslaan eigen gebruik of voor delen
met andere gebruikers.
Themacomponenten wijzigen:
2. Klik op het thema dat u wilt wijzigen om het op uw bureaublad toe te passen.
3. Voer een of meer van de volgende handelingen uit:
3.1. Als u de achtergrond wilt wijzigen, klikt u op Bureaubladachtergrond, schakelt u het selectievakje in voor de afbeelding die u wilt gebruiken en klikt u vervolgens op Wijzigingen opslaan.
3.2. Als u de kleur van de vensterranden wilt wijzigen, klikt u op Vensterkleur, klikt u op de kleur die u wilt gebruiken en klikt u vervolgens op Wijzigingen opslaan.
3.3. Als u geluiden voor een thema wilt wijzigen, klikt u op Geluiden, selecteert u een item in de lijst Geluidsschema's en klikt u vervolgens op OK. 3.4. Om een screensaver toe te voegen of te wijzigen, klikt u op Screensaver, selecteert u het lijstitem Screensaver en wijzigt u alles vereiste parameters
en klik vervolgens op OK.
Het gewijzigde thema verschijnt in de sectie Mijn thema's als een niet-opgeslagen thema. Het gewijzigde thema alleen voor eigen gebruik opslaan
1. Open het gedeelte 'Personalisatie'. Om dit te doen, klikt u op de Start-knop en selecteert u Configuratiescherm. Typ personalisatie in het zoekvak en klik vervolgens op Personalisatie. Het thema wordt weergegeven in de lijst Mijn thema's. Houd er rekening mee dat deze methode voor het opslaan van onderwerpen niet voorziet algemene toegang
===================
================
Een aangepast thema opslaan om met andere gebruikers te delen:
Volg deze stappen om een aangepast thema te delen:
Om het onderwerp te verspreiden dat u kunt gebruiken
e-mail, netwerk of externe harde schijf.
Het gewijzigde thema verschijnt in de sectie Mijn thema's als een niet-opgeslagen thema. Het gewijzigde thema alleen voor eigen gebruik opslaan
2. Klik op het gewijzigde thema om het op uw bureaublad toe te passen.
3. Klik op een onderwerp klik met de rechtermuisknop en selecteer vervolgens Thema opslaan om te delen. Pas het Windows 7-thema aan
Wat is een thema | configureer Aero in Win7 maak een thema)
Hiervoor heeft u een speciale webthemabouwer, een beetje inspiratie en een paar minuten vrije tijd nodig. Hoewel als je last hebt van perfectionisme, je er wel enkele uurtjes mee bezig kunt zijn. We hebben je gewaarschuwd. :)
Open dus de webapplicatie. U ziet tabbladen met hulpmiddelen voor het maken van thema's aan de linkerkant van het venster en een gebied voor voorbeeld resultaat aan de rechterkant.
Met deze constructor kunt u thema's maken in een semi-automatische modus. Maar je kunt ook alles handmatig aanpassen, zodat het resultaat helemaal naar jouw smaak past.
1. Gemakkelijke manier
Het punt is dit: je uploadt elke gewenste afbeelding naar de constructor, en ThemeBeta gebruikt deze als de hoofdachtergrond voor het nieuwe thema en past er automatisch alle ontwerpkleuren op aan.
Om uw eigen afbeelding toe te voegen, klikt u op het tabblad Basis op Een afbeelding uploaden en selecteert u gewenst beeld op de computer. Als u vervolgens de editor de themakleuren wilt laten aanpassen, klikt u op Kleuren genereren.
Als u tevreden bent met het resultaat, klikt u op Inpakken en installeren en bevestigt u het downloaden en voegt u vervolgens het thema toe aan Chrome. De browser activeert onmiddellijk het nieuwe ontwerp.
Als na automatische instellingen waarvoor u de kleuren wilt wijzigen of afzonderlijke achtergronden wilt toevoegen verschillende elementen thema's, heb je de tools onder de andere tabbladen nodig. Meer details hierover vindt u in de volgende paragraaf van het artikel.
2. Geavanceerde methode
Deze methode is handmatige instelling achtergronden en tekstkleuren voor het nieuwe thema.
Om afbeeldingen of kleuren als achtergrond voor verschillende ontwerpelementen te selecteren, gebruikt u de hulpmiddelen onder het tabblad Afbeeldingen. Beweeg uw cursor gewoon over een hulpmiddel en in het venster aan de rechterkant laat de ontwerper zien welk deel van het thema het verandert. NTP Achtergrond wordt bijvoorbeeld gebruikt om de hoofdachtergrond te configureren. En met Tabachtergrond kunt u de achtergrond van de sitekop selecteren.
Nadat u de achtergronden heeft bepaald, kunt u de tekstkleuren aanpassen op het tabblad Kleuren. Alles werkt hier op dezelfde manier. Er is een lijst met hulpmiddelen, wijs er een aan - en in het venster aan de rechterkant ziet u waarvoor het verantwoordelijk is.
Wanneer u klaar bent met de achtergronden en tekstkleuren, opent u het tabblad Inpakken en klikt u op Inpakken en installeren om het door u gekozen thema te downloaden en toe te passen.
Bovendien kunt u altijd al een van de vele kiezen en installeren kant-en-klare thema's uit de ThemeBeta-database of de officiële Google-catalogus. Mocht u in de toekomst nog eens naar terug willen keren standaard ontwerp, ga naar Chrome-instellingen en klik tegenover het item "Thema's" op "Standaardschaal".
WordPress-thema’s bestaan uit bestanden en stijlen die samen definiëren verschijning plaats. Ze kunnen erg van elkaar verschillen, waardoor gebruikers het ontwerp van de website snel kunnen wijzigen. Maar waarom zou je een eigen thema nodig hebben?
- Om je eigen te creëren uniek ontwerp plaats.
- Om te gebruiken en om verschillende inhoud en paginastijlen weer te geven.
- Om alternatieve sjablonen te maken voor speciale secties site, bijvoorbeeld voor categoriepagina's en zoekresultaten.
- Om snel te schakelen tussen twee site-indelingen, of om gebruikers in staat te stellen het uiterlijk van uw site te wijzigen.
- Om uw thema openbaar te maken en anderen van uw ontwerp te laten genieten.
Een WordPress-thema biedt ook enkele voordelen.
- Ze scheidt presentatiestijlen van systeembestanden, zodat u updates kunt uitvoeren zonder sterke veranderingen uiterlijk van de website.
- Hiermee kunt u themaspecifieke uitvoeropties aanpassen.
- Hiermee kun je snel het uiterlijk van een WordPress-site veranderen.
- Dankzij dit is het niet nodig dat de gebruiker CSS, HTML en PHP leert om zijn website aantrekkelijk te maken.
Maar waarom zou je er zelf een maken? eigen onderwerp? Dat is de belangrijkste vraag.
- Dit is een kans om meer te leren over CSS, HTML/XHTML en PHP.
- Dit is een kans om te pronken met uw vaardigheden in CSS, HTML/XHTML en PHP.
- Dit is een kans om te creëren.
- Het is leuk (voor het grootste deel).
- Als je je thema openbaar hebt gemaakt, krijg je de voldoening om iets te delen en terug te geven aan de WordPress-gemeenschap (je kunt opscheppen!)
Standaarden voor het maken van thema's
Houd u bij het coderen van WordPress-thema’s aan de volgende normen:
- Gebruik correct gestructureerde, foutloze PHP-code en geldige HTML-code (zie).
- Gebruik correct samengestelde, geldige CSS-code (zie).
- Volg de aanbevelingen voor.
Anatomische onderwerpen
WordPress-thema’s bevinden zich in de submap wp-content/themes/. De themamap bevat stijlbladen, file extra functionaliteit(functions.php) en afbeeldingen. Een thema met de naam "test" zou zich bijvoorbeeld waarschijnlijk in de map wp-content/themes/test/ bevinden.
Door standaard WordPress bevat drie thema's gemaakt door het team Wordpress-ontwikkelaars: "Twenty Fifteen", "Twenty Sixteen" en "Twenty Seventeen". Deze thema's verschillen van elkaar en worden gebruikt verschillende functies en tags om het uiterlijk van de site te creëren. Bekijk hun componentbestanden eens nader om beter te begrijpen hoe u uw eigen thema kunt maken.
Een WordPress-thema bestaat naast afbeeldingen uit drie hoofdbestandstypen. De eerste is een stijlblad genaamd style.css, dat het uiterlijk van de pagina's van de site bepaalt. De tweede biedt een extra functionaliteitsbestand (functions.php). De overige bestanden zijn sjabloonbestanden die bepalen hoe informatie uit de database op de webpagina wordt weergegeven. Laten we elk type afzonderlijk bekijken.
Thema-stijlblad
Naast het daadwerkelijke stylesheet van uw thema, het style.css-bestand Noodzakelijkerwijs moet informatie over uw onderwerp bevatten in de vorm van opmerkingen. Elk onderwerp moet zijn eigen unieke informatie hebben in de kopopmerkingen, anders ontstaan er problemen in . Creëren nieuw onderwerp Op basis van de bestaande, wijzigt u eerst de koptekstopmerkingen.
Hieronder vindt u een stijlbladkopsjabloon voor uw Rose-thema. Het moet zich aan het begin van het style.css-bestand bevinden, in de eerste regels:
/* Themanaam: Rose Thema-URI: thema-homepage Beschrijving: korte beschrijving van het thema Auteur: uw naam Auteur URI: uw-URI Sjabloon: schrijf-bovenliggende-thema-naam-hier-optioneel-veld Versie: versie -nummer is een optioneel veld. Gedetailleerde beschrijving van het onderwerp/licentie indien nodig. . */
Het eenvoudigste thema bevat alleen een style.css-bestand plus afbeeldingen indien nodig. Om een dergelijk thema te maken, moet u de naam van het bovenliggende thema opgeven in de titelbalk van de sjabloon: Als uw 'Rose'-thema bijvoorbeeld afkomstig is van het 'test'-thema (erft), schrijft u de volgende regel in de header style.css:
Sjabloon: testen
Door deze regel aan de header style.css toe te voegen, worden alle sjablonen in het "test"-thema overgenomen door uw "Rose"-thema, dat niets anders bevat dan een stylesheet-bestand met de naam style.css en mogelijk enkele afbeeldingen. Deze bestanden moeten in de map wp-content/themes/Rose worden geplaatst.
Sinds WordPress 2.7 kan een child-thema sjabloonbestanden bevatten waarvan de namen dezelfde zijn als de sjabloonnamen in het bovenliggende thema. In het beheerderspaneel kun je deze sjablonen selecteren om te gebruiken, en ze zullen worden gebruikt in plaats van de bovenliggende thema's.
Opmerkingen in de header style.css zijn nodig voor WordPress om het thema te identificeren en weer te geven in het submenu > als geïnstalleerd thema, samen met andere geïnstalleerde thema's.
Opmerking : Wanneer u een bovenliggend thema definieert, moet u in de regel Sjabloon: commentaar de naam van de map van het thema gebruiken. Als u bijvoorbeeld het "Standaard Wordpress-thema" wilt gebruiken, schrijf dan niet
Sjabloon: WordPress-standaard
en schrijf
Sjabloon: standaard
aangezien "default" de naam is van de map van het bovenliggende thema.
Extra functionaliteitsbestand
Het thema kan bovendien een bestand gebruiken met noodzakelijke functies Om het thema te laten werken, moet het zich in de themamap bevinden en functies.php heten. Dit bestand werkt in principe als een plug-in en als het aanwezig is in de themamap die u gebruikt, wordt het automatisch geladen tijdens de initialisatie van WordPress. Dit geldt zowel voor de beheerderspagina's als voor andere (externe) beheerderspagina's. Aangeboden volgende gebruik voor dit bestand:
- Definieer de functies die worden gebruikt in de sjabloonbestanden van uw thema;
- Instellingen in het beheerdersgedeelte van uw thema waarmee gebruikers de kleuren, stijlen of andere aspecten van uw thema kunnen aanpassen.
Thema's die bij WordPress worden geleverd en standaard worden geïnstalleerd, hebben een function.php-bestand dat een aantal functies en instellingen definieert in het beheergebied van het thema, zodat u dit als model kunt gebruiken. Het function.php-bestand werkt in principe als een plug-in, Code-sectie - beste plek waar je meer kunt krijgen gedetailleerde informatie over hoe u dit bestand kunt gebruiken.
Themasjabloonbestanden
Sjabloonselectie op basis van query's
WordPress staat de programmeur toe om te gebruiken verschillende opties om sjablonen uit de set te verbinden: ten eerste door gebruik te maken van de sjabloonhiërarchie, en ten tweede door gebruik te maken van voorwaardelijke tags binnen de verwerkingscyclus van sjabloonbestanden.
In het eerste geval moet u, wanneer u een sjabloonhiërarchie gebruikt, een sjabloon maken speciale bestanden sjablonen die automatisch op het juiste moment worden gebruikt om de pagina te maken in plaats van de basisindex.php-sjabloon. Als uw thema bijvoorbeeld een sjabloon bevat met de naam categorie.php en er komt een verzoek voor een categoriepagina, dan wordt het categorie.php-sjabloon geladen in plaats van het index.php-sjabloon. Als er geen categorie.php-bestand in het thema aanwezig is, wordt de index.php-sjabloon zoals gewoonlijk geladen.
U kunt een sjabloon voor een specifieke categorie definiëren, bijvoorbeeld door een categorie-6.php-sjabloonbestand aan uw thema toe te voegen. Het bestand wordt gebruikt in plaats van index.php als de categorie-ID 6 is. Om de categorie-ID te achterhalen, gaat u naar > als u beheerderstoegang heeft in WordPress versie 2.3 of lager.
Vanaf WordPress 2.5 is de ID-kolom verwijderd uit het beheerdersdashboard. U kunt de categorie-ID bepalen door op 'Categorie bewerken' te klikken en naar de cat_ID-waarde in de URL te kijken. Het einde van de URL bijvoorbeeld:
"...categorie.php?action=bewerken&cat_ID=3"
waarbij "3" de ID van de huidige categorie is. Dit proces wordt in meer detail besproken in
Als uw thema de weergavesjabloon nog gedetailleerder moet kunnen beheren dan het controleniveau dat door de sjabloonhiërarchie wordt geboden, kunt u voorwaardelijke tags gebruiken. Voorwaardelijke tags controleren feitelijk of een speciale voorwaarde tijdens runtime waar is. In dat geval kunt u een specifieke sjabloon laden of enkele tekstvariaties op de pagina weergeven op basis van die voorwaarde.
Als u bijvoorbeeld verschillende stijlen wilt maken, afhankelijk van het categorienummer, kan de code er als volgt uitzien:
Of, met behulp van een verzoekobject, kan hetzelfde algoritme op een andere manier worden geïmplementeerd:
na; if ($post->in_category("9")) ( include(TEMPLATEPATH . "/single2.php"); ) else ( include(TEMPLATEPATH . "/single1.php"); ) ?>
In ieder geval zullen beide codevoorbeelden verschillende patronen opleveren, afhankelijk van de categorie-ID. Voorwaardelijke tags zijn niet beperkt tot categorieën, zie het artikel, daarin worden alle mogelijke opties besproken.
Pictogrammen voor bestandstypen
Wordpress gebruikt bestandstypepictogrammen () op uw blog en in de interface van het beheerdersdashboard als deze pictogrammen op de opgegeven locatie voorkomen.
Wordpress zoekt naar deze bestanden in de afbeeldingenmap van het huidige thema. (En in Wordpress 2.2 heeft het standaardthema slechts één pictogram, audio.jpg .)
Om bijvoorbeeld een pictogram van het MIME-type audio/mpeg weer te geven, zoekt Wordpress naar het pictogrambestand in opgegeven map afbeeldingen van het huidige thema, selecteert het het eerste overeenkomende bestand (zie functiebeschrijving):
- mijn_thema/images/audio.jpg
- mijn_thema /images/audio.gif
- mijn_thema/images/audio.png
- mijn_thema/images/mpeg.jpg
- mijn_thema /images/mpeg.gif
- mijn_thema /images/mpeg.png
- mijn_thema /images/audio_mpeg.jpg
- mijn_thema /images/audio_mpeg.gif
- mijn_thema /images/audio_mpeg.png
Lijst met standaard themasjabloonbestanden
Hieronder vindt u een lijst met standaardsjabloonbestanden die door WordPress worden gebruikt. Uiteraard kan uw thema andere stijl-, afbeeldings- of programmabestanden bevatten. Houd er rekening mee dat de onderstaande bestandsnamen een speciale betekenis hebben voor WordPress - zie het hiërarchiesjabloon voor aanvullende informatie.
Stijl.css Hoofdbestand stijlbladen. Het bestand moet in het onderwerp staan Noodzakelijkerwijs en moet de hierboven beschreven opmerkingen in de bestandskop bevatten. index.php Hoofdsjabloonbestand. Als u uw eigen sjablonen in uw thema gebruikt, is dit index.php-bestand vereist. comments.php Commentaarsjabloon. Als dit niet aanwezig is, wordt het bestand comments.php uit het standaardthema gebruikt.
commentaren-popup.php Voegt een pop-upmenu toe voor JS-opmerkingen. Indien niet aanwezig, wordt commentaren-popup.php aangeroepen vanuit het standaardthema.
Als u bijvoorbeeld één bericht wilt weergeven, retourneert de functie "true" en bevindt er zich een single.php-sjabloonbestand in de actieve themamap. Dit sjabloon wordt gebruikt om de pagina te maken.
Links naar bestanden uit de sjabloon
Het standaard WordPress-thema is goed voorbeeld techniek (voor het eerst beschreven door Michael Heilemann in Kubrick's WordPress 1.2-indeling) van hoe query's worden weergegeven in sjablonen.
De volgende codevoegt de sjabloon-URL in de sjabloonuitvoer in. U kunt aanvullende informatie toevoegen om naar bestanden uit uw thema te linken.
De volgende codevoegt de URL van de map die de .css-bestanden van uw thema bevat toe aan de sjabloonuitvoer. U kunt aanvullende informatie toevoegen om naar uw themabestanden te verwijzen, vooral de informatie die nodig is voor stylesheets (om dit te voorkomen, gebruikt u dit in plaats daarvan).
De constante TEMPLATEPATH bevat het absolute pad naar de sjabloonmap van het huidige thema (zonder de "/" aan het einde).
Houd er rekening mee dat de URI's die in het stijlblad worden gebruikt, gebonden zijn aan de map waar het stijlbladbestand zich bevindt, en niet aan de map waar de sjabloon zich bevindt die deze stijlen gebruikt. Dit elimineert de noodzaak om PHP-code aan het stylesheet-bestand toe te voegen om de huidige map in te stellen. Als u bijvoorbeeld afbeeldingen uit de map images/ van uw thema in uw stylesheet gebruikt, moet u dit alleen in de CSS opgeven relatief pad, Bijvoorbeeld:
H1 (achtergrondafbeelding: URL(afbeeldingen/mijn_achtergrond.jpg); )
Dit goede optie gebruik de hierboven beschreven methode om naar bestanden te linken. In dit geval heb je dat niet nodig absolute paden in uw sjablonen.
Aangepaste sjabloontypen definiëren
Om uw eigen typen sjablonen toe te voegen die in specifieke gevallen worden gebruikt, kunt u het systeem gebruiken WordPress-plug-ins. Dit is nodig als u bijvoorbeeld verschillende lay-outs voor verschillende cases of een eigen commentaarsjabloon wilt maken, enz. Deze WordPress-extensie kan worden bereikt door de template_redirect-gebeurtenis te onderscheppen, zie . Meer informatie over het maken van plug-ins vindt u hier.
Vereiste gebeurtenisoproepen voor compatibiliteit
Bij het ontwerpen van een thema is het raadzaam om er rekening mee te houden dat je thema zo moet worden geconfigureerd dat het goed kan werken met elke WordPress plugin die jij of een andere gebruiker van jouw thema wil installeren. Plug-ins breiden uit functionaliteit WordPress gebruikt "Action Hooks", zie voor meer informatie. De meeste gebeurtenissen vinden plaats in de WordPress-kern, dus uw thema hoeft geen aangepaste gebeurtenissen aan te roepen om te functioneren. Maar sommige onderschepte gebeurtenissen zullen nog steeds moeten worden aangeroepen zodat de geïnstalleerde plug-ins informatie correct kunnen weergeven, rechtstreeks in de koptekst (header) en voettekst (footer), in de zijbalk of in het hoofdgedeelte van de pagina. Hier is een lijst met speciale gebeurtenistags die in uw thema moeten worden aangeroepen correcte werking eventuele plug-ins:
Wp_head Treedt op wanneer de code van het element wordt weergegeven
in de header.php-sjabloon. Voorbeeld van gebruik in de plug-in: javascript-code toevoegen. Gebruik: -of- wp_footer Treedt op wanneer de header wordt weergegeven ( koptekst Gebruik: ) "voettekst"-thema in de footer.php-sjabloon. Een voorbeeld van gebruik in de plug-in: het invoegen van PHP-code die na alles moet worden uitgevoerd, de allerlaatste op de pagina.comment_form Treedt op wanneer de templatescripts comments.php en comments-popup.php worden verwerkt, onmiddellijk voordat de tag voor het commentaarformulier wordt gesloten ( ). Gebruiksvoorbeeld: toon een voorbeeld van nieuw toegevoegde opmerkingen. Gebruik:
identiteitskaart); ?>
Voor
- echt voorbeeld
- , kunt u deze evenementoproepen voor plug-ins vinden in hun respectievelijke standaardthemasjablonen.
- Algemene opmerkingen voor thema-ontwikkelaars
- Wees duidelijk en beschrijf in uw themadocumentatie (een README-bestand dat bij uw thema wordt geleverd, zal veel gebruikers helpen mogelijke struikelblokken te omzeilen):
- Geef precies aan waarvoor uw thema- en sjabloonbestanden dienen. Volg de naamgevingsconventie in de standaardthemahiërarchie., die aangepaste overschrijf- of wijzigingsregels kunnen bevatten, of het gebruik van enkele aanvullende, speciale sjablonen, afbeeldingen of andere bestanden, geef duidelijk aan welke gebruikersactiestappen hij moet ondernemen om uw thema volledig functioneel te krijgen.
- Probeer uw thema uit en test het verschillende browsers om op zijn minst enkele van de problemen op te vangen die gebruikers kunnen tegenkomen.
- Specificeer contactgegevens(webpagina of e-mail), indien mogelijk, voor informatie ondersteuning en gebruikersvragen.
Links en bronnen
Een volledige lijst met bronnen met betrekking tot thema's en sjablonen is beschikbaar in het artikel.
Velen die Windows 7 hebben geïnstalleerd, kunnen geen genoeg krijgen van de Aero-interface. Hoe maak je je eigen thema in Windows 7?
Alles is heel eenvoudig - ik zou zelfs zeggen intuïtief, aangezien ik het zelf deed 3 minuten nadat ik mijn eigen thema wilde maken.
Om het duidelijker te maken, zal ik instructies in foto's maken, wat ik heb Engelse taal in Windows denk ik dat het niemand pijn zal doen. In andere talen is alles vergelijkbaar.
1. Klik met de rechtermuisknop op het bureaublad en selecteer Personaliseren.
3. Er wordt een achtergrondselectievenster geopend. Schakel onnodige foto's uit. En indien nodig gebruik je de knop Bladeren om de map te selecteren met de foto's die je aan het thema wilt toevoegen. Het is optimaal dat foto's een resolutie van minimaal 1024 bij 768 hebben. JPEG-formaat. Foto's van 5-8. Dit is als u het onderwerp op internet gaat plaatsen. Als u een Windows 7-thema voor uzelf maakt, doe het dan zoals u wilt. Vergeet onderaan het selectievakje niet: weergaveopties: willekeurig of opeenvolgend. U kunt ook een locatie selecteren achtergrondafbeelding– de standaardwaarde is meestal optimale waarde(rek de afbeelding uit).
4. Sla vervolgens de wijzigingen op. U ziet opnieuw het venster uit stap 2. Selecteer Windows-kleur - dit is in wezen de themakleur. U kunt een kleur kiezen uit de voorgestelde kleuren of uw eigen tint maken. Kies bovendien uw transparantie.
5. Sla vervolgens de wijzigingen op. U ziet opnieuw het venster uit stap 2. Selecteer Geluiden. Ga in detail in op hoe u uw eigen kunt maken geluidsschema- Dat doe ik niet. U kunt kiezen uit de voorgestelde opties in de vervolgkeuzelijst.
6. Je kunt een screensaver voor het thema kiezen, maar ik denk niet dat het nodig is om deze helemaal te kiezen, behalve misschien voor een zwart scherm. Daarom laten we het item Screen Saver veilig achterwege.
7. Vervolgens zullen we zien dat het thema al in de sectie Mijn thema's staat en dat er staat dat het niet is opgeslagen (niet-opgeslagen thema). Klik er met de rechtermuisknop op en selecteer uit de vervolgkeuzelijst: het eerste item Thema opslaan, als we het gewoon op onze computer willen opslaan (voer gewoon een naam in). Of selecteer: tweede item Thema opslaan om te delen om het thema in een bestand op te slaan.
8. Het hele onderwerp is aangemaakt. U kunt het gratis Windows 7-thema downloaden: Dierentuin van Chiang Mai. Hierop heb ik mijn experimenten uitgevoerd. De foto's daar zijn allemaal door mij gemaakt.
