Programma voor het wijzigen van wordpress-sjablonen. Hoe u het gewenste item kunt vinden. Uw eigen moduleposities maken

Van de auteur: Hallo vrienden, in een ander artikel over het onderwerp WordPress. Als je voor de taak staat om iets in de themacode op je WordPress-site te wijzigen, dan kan het artikel Een WordPress-thema bewerken, denk ik, van pas komen. In dit artikel zullen we proberen te leren hoe u een WordPress-thema kunt bewerken.

We stonden dus voor de taak om kleine wijzigingen aan de WordPress-site aan te brengen. Tegelijkertijd zijn deze bewerkingen op geen enkele manier gerelateerd aan de teksten van pagina's of artikelen, anders zou je nauwelijks op zoek zijn naar een antwoord op de vraag in dit artikel, maar gewoon de tekst van het artikel of de pagina bewerken. Niet, het komt precies over de aanpassingen die gedaan moeten worden in de code van je WordPress thema. U moet bijvoorbeeld de afbeelding in de kop van de site wijzigen, een conclusie toevoegen over het auteurschap van het artikel of, omgekeerd, iets uit de uitvoer verwijderen, of de kleur van de link, de grootte van het lettertype of titel, enzovoort. Voor dit alles moet je naar de themacode gaan. Laten we proberen dit te doen.

Voordat we beginnen met het bewerken van een thema, zijn er een paar dingen die u moet doen. belangrijke aantekeningen:

we hebben het specifiek over kleine aanpassingen, en niet over kardinale veranderingen in het onderwerp, in het laatste geval kun je beter de webmaster om hulp vragen;

dit artikel is geen standaardrecept, omdat thema's op verschillende manieren kunnen worden gemaakt.

Als voorbeeld neem ik standaard thema Twenty Fifteen, die wordt geleverd met WordPress. Rekening houdend met de opmerking hierboven over: verschillende manieren onderwerpen maken, is het beter om het uit te leggen op een van de standaard thema's WordPress. Laten we eens kijken naar de structuur van de themamap.

Zoals je kunt zien, zijn er hier veel bestanden. Laten we eerst eens kijken naar het bestand style.css. Dit is een themastijlbestand en hierin worden in de regel de regels voor het ontwerp van het thema opgeslagen. Daarom, als u wijzigingen moet aanbrengen met betrekking tot het ontwerp, heeft u hoogstwaarschijnlijk een style.css-bestand nodig.

Laten we als voorbeeld de koppen van de artikeltitels verkleinen. Via de ontwikkelaarstools kunnen we in de stylesheet de regels vinden die verantwoordelijk zijn voor het ontwerp van een bepaald element.

Laten we het bestand style.css in een editor openen en de waarde van de eigenschap font-size voor de artikeltitel wijzigen van 3.9 in 2.9. Laten we het bestand opslaan, bijwerken op de server en na het vernieuwen van de pagina kunnen we zien dat de koptekst kleiner is geworden. Op precies dezelfde manier kunnen we het uiterlijk van elk ander element in het ontwerp van uw thema wijzigen.

content.php - het bestand is verantwoordelijk voor het centrale deel van de site, dat wil zeggen het inhoudsgebied;

footer.php - de footer van de site (footer of footer);

koptekst.php - bovenste deel site (koptekst of koptekst);

sidebar.php - de zijbalk van de site (zijbalk).

Laten we bijvoorbeeld dezelfde titel van het artikel nemen en proberen deze een beetje aan te passen. In het Twenty Fifteen-thema is dit de kop op het tweede niveau (h2). Laten we het vervangen door bijvoorbeeld een kop op het derde niveau (h3). Open hiervoor de content.php-sjabloon, probeer het bijbehorende gedeelte van de code te vinden en breng wijzigingen aan. Hier is de code:

Na het wijzigen van h2 in h3 en het opslaan van het bestand, zouden we de bijbehorende wijzigingen op de site moeten zien. Evenzo wordt het bewerken gedaan voor andere elementen van uw thema. Ook hier herhaal ik dat het artikel voornamelijk gaat over het bewerken van een WordPress-thema, d.w.z. over het maken van enkele kleine wijzigingen aan de themastructuur of over het wijzigen van het ontwerp. Als u drastische wijzigingen moet aanbrengen, heeft u, zoals hierboven vermeld, twee opties:

vraag de webmaster om hulp, die zal betalen voor de juiste vergoeding nodige veranderingen naar dit onderwerp;

bestudeer de kwestie van het zelf maken van thema's, in dit geval zal het niet moeilijk voor je zijn om het WordPress-thema zelf te bewerken.

Als u besluit voor de tweede optie te kiezen, dan kan ik u onze . aanbevelen gratis cursus gewijd aan het maken van thema's voor WordPress of. Nou, bij deze neem ik afscheid. Veel succes en tot snel!

Bij het maken van een website worden velen geconfronteerd met een ontwerpprobleem, vooral degenen die niets van de code begrijpen. Gebruiken standaard sjabloon Dat wil ik eigenlijk niet, want in de uitgestrektheid van het netwerk kun je meer dan één van deze sites tegenkomen, en bovendien zijn veel van hen één kolom, onopvallend en sommige hebben ingesloten links (probeer deze tekst te verwijderen - de sjabloon is waarschijnlijk zeer scheef). Maar als je geld hebt, kun je een premium-sjabloon kopen (er zal vertrouwen zijn in de kwaliteit van prestaties en functionaliteit).

Maar als je niet veel wilt verspillen, dan is de beste manier om uit de situatie te komen het gebruik van gratis diensten om WordPress-thema's te maken, waaraan ons materiaal is gewijd.

En als je wilt voelen professionele ontwerper, dan zullen we aan het einde van het artikel ook overwegen: betaalde dienst, waarmee u premium sjablonen kunt maken.

Themabouwer voor WordPress lubith.com

Eerst zullen we kijken naar de bron voor het maken van sjablonen lubith.com, die, van de vele buitenlandse die we hebben geprobeerd, de meest eenvoudige en handige leek. Bovendien is het in staat om een ​​eenvoudige sjabloonstructuur te vormen, waarin alle bestanden in één oogopslag worden gepresenteerd. En natuurlijk maakt deze generator thema's speciaal voor de WordPress-site.

Deze bron codeert de koppelingen niet nadat de sjabloon is gegenereerd en biedt toegang tot de belangrijkste stijlbestanden, die veel analogen niet bieden, wat helemaal niet zo is. Ga dus naar de site, doorloop een eenvoudig registratieproces, klik op de link "Editor" en ga naar de editor, die zelf vrij eenvoudig en duidelijk te gebruiken is. Het belangrijkste hier is om op zijn minst een beetje Engels te begrijpen.

De functionaliteit van de generator maakt het mogelijk om te roamen: je kunt een frame instellen voor elk blok, enz. Dit alles kan worden gedaan door te vragen juiste maat in pixels of door de rand van het blok met de cursor opzij te slepen. Indien nodig kunt u alle items die u niet nodig heeft verwijderen. Sommige mensen geven bijvoorbeeld de voorkeur aan sites die geen beschrijvende tekst hebben.

De sjabloon is in ongeveer 15 minuten gemaakt en zodra u besluit dat alles wat u nodig hebt is gedaan, klikt u op de knop "Downloaden", waarna het archief met alle benodigde bestanden... Welnu, om dit thema op uw site te plaatsen, volstaat het om het archief naar de hosting te uploaden. Deze WordPress-themagenerator is shareware, dus “ gratis versie»Is niet zonder nadelen: u kunt de sjabloon niet opnieuw corrigeren, u kunt het type opmerkingen niet bewerken, u kunt niet meer dan één thema maken (dwz u kunt niet om de sjabloon bij te werken).

De generator voegt zijn links in, maar dit is niet kritisch, omdat ze niet gecodeerd zijn. Ga gewoon naar footer.php en zoek de code die de woorden "Wordpress Theme Generator" of www.lubith.com vermeldt. Het blok waar de link zich bevindt - u kunt deze volledig verwijderen of de links naar uw eigen link wijzigen. Nu zal uw sjabloon "maagdelijkheid" krijgen, maar u moet alles in een beetje meer detail overwegen om te kunnen bewerken wat uw hartje begeert (inclusief de tekst).

Dit is nodig als u bijvoorbeeld links, titels, etc. moet wijzigen. Open hiervoor het bestand style.css in WordPress. Het bevat blokken die verantwoordelijk zijn voor een specifiek onderdeel:

• Wrapper - achtergrondblok, bevat alle andere;
• Container - een blok met de belangrijkste inhoudssites;
• Koptekst - sitekoptekst;
• Sitetitel - titelblok van de site;
• Sitebeschrijving - sitebeschrijvingsblok;
• Toegang (menu) - menublokken onder de sitekop;
• Inhoud - een blok van het inhoudsgedeelte van de bron (waar de berichten zich bevinden);
• Primair - verantwoordelijk voor de widget aan de rechterkant;
• Entry-titel - een blok met informatie over de publicatie en de auteur;
• Entry-meta - een blok met postkoppen;
• Widgettitile - titel van een widget;
• Textwidget - de hoofdtekst van de widget.

Daarnaast zijn er blokken die kunnen worden gewijzigd: footer (footer), link (links view), comments (commentaren en hun auteurs view), home.sticky (weergave van bijgevoegde berichten op de hoofdpagina), primary (verantwoordelijk voor de widget aan de rechterkant), secundair (verantwoordelijk voor de widget aan de linkerkant), blockquote (citaatontwerp). Dat is alles.

Plugin "Gratis Online Template Builder"

Met deze plug-in kunnen we maken: unieke sjabloon voor uw website. Het zal zelfs voor een beginner niet moeilijk zijn om de functionaliteit en instellingen te begrijpen, omdat het hele installatieproces plaatsvindt in echte modus via het beheerderspaneel. In feite is het een van de vele WordPress-thema's, maar een die een uitgebreide reeks mogelijkheden tot zijn beschikking heeft, die we hieronder zullen bespreken:

• de ontwerper heeft aanvankelijk 6 voorgeïnstalleerde thema's (u kunt ze bijwerken), maar het is nog steeds beter om uw eigen thema's te maken;
• het tabblad "Indeling" biedt een mogelijkheid (het aantal kolommen, hun plaatsing);
• op het tabblad "Sjablonen" kunt u de weergave wijzigen Startpagina, pagina's met records, aparte pagina, en u kunt ook datums, tags, koppen, zoeken wijzigen;
• het tabblad "Header" is verantwoordelijk voor het weergeven van het bovenste gedeelte van het onderwerp (u kunt de tekst van het hoofdonderwerp wijzigen);
• op het tabblad "Instellingen voor inhoud" kunt u het uiterlijk van de link naar de pagina van de auteur, lijsten met categorieën, tags, weergave van opmerkingen en sociale pictogrammen wijzigen. netwerken;
• het is mogelijk om de miniaturen van opmerkingen te wijzigen;
• "footer" instellen (u kunt elke tekst of code invoegen);
• aanpassing van lettertypen (tekst kan worden gewijzigd in grootte en kleur);
• u kunt kleuren en transparantie wijzigen;
• blok ontwerp;
• bewerken van CSS-code (u kunt naar eigen goeddunken bijwerken);
• afbeeldingen instellen, afbeeldingen op de juiste plaats invoegen;
• het instellen van de schuifregelaar, die wordt weergegeven in het bovenste gedeelte onder de koptekst (de tekst van de schuifregelaar kan worden gewijzigd in uw eigen tekst).

Zoals je kan zien deze generator sjablonen heeft uitgebreide functionaliteit originele thema's te creëren. Het zal een plezier zijn om er websites mee te maken. Je kunt de constructor daadwerkelijk krijgen via deze link. Als de plug-inversie verouderd is, kunt u deze altijd updaten naar een nieuwe versie via het beheerdersdashboard.

Beste lezers, in dit artikel zullen we leren hoe je een WordPress-sjabloon kunt bewerken.
Voor degenen die nog niet bekend zijn met de structuur van de WordPress-sjabloon, is dit artikel een must-read. De inhoud van het artikel:

Ik zie twee hoofdredenen waarom we dit nodig hebben:

• De meeste blog-instellingen zijn gerelateerd aan het bewerken van de code - html of css. In veel van mijn artikelen schrijf ik over wat er moet worden bewerkt specifiek bestand thema's. Als je niet weet hoe je naar deze bestanden moet zoeken en op welke manier het handiger is om ze te bewerken, dan is dit artikel iets voor jou.
• Bij het maken van een blog heb je er een thema (sjabloon) op geïnstalleerd van internet en wil je er iets aan veranderen, ontwerpelementen of functionele blokken toevoegen. Maar hiervoor moet je minimaal minimale kennis hebben van HTML en CSS. Of je nu een beginner bent of ervaring hebt met het maken van websites, voor het bewerken WordPress-sjabloon je moet begrijpen waar het uit bestaat en waar elk onderdeel voor dient. Laten we dus beginnen met te kijken naar de structuur van een WordPress-sjabloon.

Structuur van WordPress-sjabloon

De HTML-code van de WordPress-sjabloon is opgesplitst in verschillende php-bestanden. Dit is gedaan voor het gemak: herhalen aan verschillende pagina's stukjes code worden verplaatst naar aparte bestanden en maak verbinding met elke pagina met functies opnemen... De koptekst, voettekst en zijbalk bevinden zich in afzonderlijke bestanden en elk paginatypebestand bevat slechts een centraal gebied: De meest bewerkte WordPress-sjabloonbestanden zijn:

• index.php - De sjabloon begint met een index.php-bestand dat uitvoer Startpagina plaats.
• header.php - Koptekst van de site. Dit bestand bevat het bovenste gedeelte, dat op elke pagina van de site wordt herhaald. Het begint met een tag , bevat volledig dat is waar de meeste scripts worden ingevoegd bij het opzetten van uw blog. Het opent een tag en een logo, slogan wordt weergegeven, Topmenu en andere kopelementen.
• style.css - het hoofdstijlbestand van de sjabloon, dat het uiterlijk van de site-elementen bepaalt. Om een ​​WordPress-sjabloon te bewerken, moet u meestal met dit bestand werken.

De rest van de bestanden:

• single.php - verantwoordelijk voor het weergeven van elk aparte invoer... Die. het uiterlijk van de pagina waarop u momenteel mijn artikel leest, wordt in dit bestand geconfigureerd.
• pagina.php - uitvoer statische pagina blog. Nieuwe pagina's worden gemaakt in het gedeelte "pagina's" in het linkermenu en hun uiterlijk wordt in dit bestand geconfigureerd.
• sidebar.php - verantwoordelijk voor het weergeven van de zijbalk (zijbalk van de blog) waar de widgets zich bevinden. Dit deel van het patroon wordt ook op elk herhaald WordPress-pagina site, daarom wordt het in een apart bestand geplaatst. Meestal hoeft u dit bestand niet te bewerken, omdat alle wijzigingen bovenop het. Niemand verbiedt echter om een ​​code rechtstreeks in het sidebar.php-bestand in te voeren.
• functies.php - bestand met php-functies van het thema. Ze hebben allemaal invloed op het uiterlijk en de werking van de site, bepalen gebeurtenissen wanneer: bepaalde acties gebruikers.
• footer.php - site footer (footer), het onderste deel. Dit is ook een terugkerend element op alle pagina's. Het bevat meestal aanwezigheidstellers, copyright en contactgegevens.
• categorie.php - dit bestand is verantwoordelijk voor het weergeven van een pagina met een lijst van alle berichten van een bepaalde categorie.
• tag.php - de uitvoer van het archief van records voor de corresponderende tag wordt in dit bestand geschreven.
• archive.php - archief van alle records voor een specifieke maand (jaar) wordt hier geconfigureerd.
• search.php - Geeft zoekresultaten van blogs weer.
• comments.php - geeft reacties op berichten en pagina's weer.
• 404.php - 404-foutsjabloon - pagina niet gevonden.

Afhankelijk van het gekozen thema kunnen er nog andere bestanden in verschijnen, dan zul je zelf moeten uitzoeken welke dat zijn.

Hoe WordPress-sjabloonbestanden te bewerken

Ik wil je meteen waarschuwen dat je niet in de code moet graven en het zelf moet proberen te herschrijven als je niets van CSS en HTML begrijpt. Het is een andere zaak wanneer er in een les staat dat je bepaalde code op een bepaalde plaats in het bestand moet invoegen. zeker doen backup bestanden en databases voordat u wijzigingen aanbrengt! Voor het bewerken van WordPress-themabestanden bied ik drie opties aan:

Een WordPress-thema instellen in het beheerdersgedeelte

Als je een kant-en-klaar WordPress-sjabloon hebt gedownload en geïnstalleerd, kunnen veel instellingen worden gedaan zonder in de code te komen. U kunt elk WordPress-thema bewerken via het blogbeheergedeelte.

Ga naar de sectie « Verschijning» — "Afstemmen", een venster met basisthema-instellingen wordt geopend. Hier kunt u de naam en beschrijving van de site invoeren, die na het opslaan in de koptekst van de site wordt weergegeven. U kunt ook de achtergrondkleur wijzigen of achtergrond afbeelding en andere instellingen - het is niet moeilijk om erachter te komen. De meeste aanpassingen aan het WordPress-thema kunnen worden gedaan in de sectie "Verschijning" -> "Uw themanaam".
Hier kunt u uw logo, favicon, etc. downloaden. Er zijn veel instellingen, maar om eerlijk te zijn, gebruik ik ze nooit, omdat het voor mij gemakkelijker is om met de code te werken om het WordPress-thema te bewerken.

Dat is alles! Kies de meest handige manier om uw WordPress-sjabloon te bewerken, afhankelijk van de situatie en vergeet nooit back-ups te maken. om geen nieuwe nuttige artikelen te missen.

PS Ik wil u eraan herinneren, beste lezers, dat als u fouten in mijn artikelen opmerkt, wees niet lui om te klikken op " Ctrl + Enter"Zodat ik ze met de hulp kan repareren.

Voor degenen die net begonnen kennis te maken met CMS Joomla u wilt altijd het uiterlijk van de site naar eigen inzicht wijzigen. Het standaardsjabloon past niet meer bij u en u wilt iets nieuws.

Velen beginnen te zoeken gratis sjablonen en installeer ze op uw site, maar na verloop van tijd beginnen ze te beseffen dat de nieuwe sjablonen hun gebreken hebben en dat er niet genoeg vaardigheden zijn om ze te repareren. Dus voordat u doorgaat met het installeren van nieuwe sjablonen ik sterk Ik raad aan om te leren hoe je ze kunt wijzigen, want in de toekomst zal het zeker van pas komen.

In deze zelfstudie laat ik u zien hoe u de koptekst voor onze site kunt bewerken met behulp van de standaard Protostar-sjabloon als voorbeeld. Wat hebben we hiervoor nodig:

• FTP-client, bijvoorbeeld FileZilla voor gemakkelijke toegang tot bestanden op de server van de hostingprovider (voor degenen die de site op de hosting hebben)
• Teksteditor (kladblok ++, sublieme tekst enzovoort.)
• Grafische editor (bijvoorbeeld Photoshop)
• webbrowser (Google chrome, Firefox, enz.)

Natuurlijk kun je ze missen (met uitzondering van de internetbrowser), maar deze programma's zullen het werk aanzienlijk vereenvoudigen.

Leren werken met stijlbestanden in Joomla

De eerste stap is om te leren hoe u de internetbrowser "correct" gebruikt, met andere woorden, leer hoe u de paginacode kunt bekijken en de regels kunt markeren die nodig zijn voor het werk.

Om de paginacode te bekijken: v verschillende browsers er is speciale teams, maar in de meeste gevallen wordt hiervoor de sleutel gebruikt. F12... In browsers zoals Google Chrome, om de code van een bepaald deel van de pagina te bekijken, kun je poke klik met de rechtermuisknop muis op dit element en selecteer "Code weergeven" in het vervolgkeuzevenster:

Na deze acties, in het onderste (of rechter) deel van de browserpagina, zien we de paginacode en de styling van alle elementen, en het vereiste element wordt gemarkeerd:

Ik zal niet ingaan op de essentie van deze code, voor degenen die al bekend zijn met HTML het zal niet moeilijk zijn om erachter te komen wat waarvoor verantwoordelijk is. U kunt zien dat de gemarkeerde titel tussen de tag staat

, waarbinnen de link zich bevindt met de tekst "Extra velden in Joomla".

In dit stadium zijn we geïnteresseerd in de ontwerpstijlen van bepaalde pagina-elementen, of het nu een titel, een menu, een afbeelding of platte tekst is.

Hoe een CSS-bestand met sjabloonstijlen te definiëren

Stijlen die van toepassing zijn op elk element zijn te zien aan de rechterkant van de browser, en iets naar rechts wordt een css-bestand getoond dat deze code bevat en een regel code waarin deze stijlen te vinden zijn:

In mijn geval de stijlen voor links zijn opgenomen in een bestand met de naam template.css op regel 219, en de stijlen voor de headers

in hetzelfde bestand op regel 7220 (zie de schermafbeelding hierboven en alles wordt duidelijk). Als je de muiscursor over de naam van het stijlbestand beweegt, kun je het pad naar dit bestand zien, ik heb dit bestand in de map sjablonen / protostar / css / sjabloon.css ... Als je hem opent, weet je dit zeker:

Nadat we de locatie van het stijlbestand hebben gevonden, kunt u het naar eigen goeddunken gaan bewerken, waardoor we het ontwerp van onze sjabloon naar eigen goeddunken kunnen wijzigen. In de toekomst zal voor degenen die niet bekend zijn met de basisprincipes van CSS, een speciale sectie worden gemaakt, maar voor nu onthouden we waar en waar we moeten zoeken voor verdere bewerking.

Ik wil opmerken dat het veel handiger is om stijlen vooraf rechtstreeks in de browser toe te passen en als het resultaat bij u past, deze vervolgens naar een bestand over te zetten. Als voorbeeld verander ik de kleur van de links op de pagina en de grootte van de koptekst in de browser, dit is wat ik uiteindelijk kreeg:

We hebben de stijlen uitgezocht, nu blijft het om uit te zoeken welk bestand verantwoordelijk is voor de structuur van de site en hoe ermee te werken.

Sitestructuurbestand - index.php

In elke Joomla-sjabloon is een specifiek bestand verantwoordelijk voor de structuur, in de meeste gevallen is dit het index.php-bestand dat zich in de hoofdmap van de sjabloonmap bevindt. In de Protostar-sjabloon bevindt het indexbestand zich in de map templates / protostar / index.php, hij is degene die verantwoordelijk is voor de locatie van bepaalde elementen op de sitepagina's.

Dit bestand bestaat uit 220 regels code geschreven in PHP-talen en HTML (en wat JavaScript) die er als volgt uitzien:

In het begin bestand gaat de code die verantwoordelijk is voor de verbinding extra bestanden(stijlen, scripts), check vooraf ingestelde instellingen sjabloon en nog veel meer. Dezelfde pagina-opmaak begint met regels (126 regels code):

Door de code te wijzigen gegeven bestand u kunt de sitesjabloon radicaal wijzigen, de weergavelocatie van moduleposities en hun nummer wijzigen, de sitekoptekst, voettekst, enzovoort wijzigen.

We zullen geen wijzigingen aanbrengen in de code, de volgende lessen zullen hieraan worden gewijd, nu zullen we slechts een paar regels code toevoegen waarmee we ons eigen stijlbestand kunnen koppelen aan onze Joomla-sjabloon.

Uw eigen stijlbestanden koppelen aan de Joomla-sjabloon

Voordat we beginnen met het opnemen van onze eigen CSS-bestanden in onze sjabloon, moeten we eerst definiëren waarvoor u het nodig heeft. Hier kunnen verschillende redenen voor zijn:
Preventie van gegevensverlies - U gebruikt een standaardsjabloon en brengt wijzigingen aan in: bestaande bestanden stijlen, na het bijwerken van het CMS, worden deze bestanden vervangen door nieuwe en gaan alle eerder aangebrachte wijzigingen verloren.
Scheiding van taken - voor elk afzonderlijk element kunt u afzonderlijke bestanden maken die alleen verantwoordelijk zijn voor het ontwerp. Maar hier is het belangrijk om het niet te overdrijven, je moet niet te veel bestanden maken.

Verschillende apparaten - nu worden niet alleen computers, maar ook telefoons, tablets en zelfs horloges gebruikt om toegang te krijgen tot internet. U kunt dus voor elk afzonderlijk apparaat alleen het stijlbestand maken en laden dat ervoor is bedoeld.

Hoe te leren creëren en verbinden eigen bestanden stijlen in kant-en-klare sjablonen altijd behulpzaam.

Uw eigen css-bestand maken

Eerst moeten we creëren nieuw bestand stijlen in de daarvoor bestemde map, meestal een map met de naam "css". Het bestand is aangemaakt op een standaard manier, de naam doet er niet toe, het belangrijkste is dat het de extensie ".css" heeft, ik heb mijn nieuwe bestand "mycss.css" genoemd.

Voeg regels code toe aan het index.php-bestand

Nu moeten we het nieuw gemaakte bestand verbinden, met andere woorden, vertel de sjabloon dat we een nieuw bestand hebben en we zullen het gebruiken. Open hiervoor het sjabloonindexbestand (index.php), in de coderegel op nummer 15 vinden we de volgende code:

We voegen er direct achter nieuwe lijn:

Je zou zoiets als het volgende moeten krijgen:

Op de dit stadium we hebben zojuist een variabele gedeclareerd waarmee we onze nieuwe stylesheet zullen opnemen. Nu moeten we nog een regel code schrijven, die direct verantwoordelijk is voor de verbinding van het CSS-bestand.

Daarna voegen we onze verbindingscode toe. css-bestand:

Ik heb het zo:

Hoe te controleren of onze stylesheet is inbegrepen

Om er zeker van te zijn dat onze stylesheet echt wordt opgenomen, moeten we de paginacode opnieuw openen, maar deze keer op een iets andere manier. Klik met de rechtermuisknop ergens op de pagina in het browservenster en selecteer het item "Paginacode weergeven" in de vervolgkeuzelijst of druk op de toetsencombinatie Ctrl + U.

In het geopende venster vinden we de coderegels die beginnen met

Als het niet in de lijst staat, moet u mogelijk de pagina opnieuw laden door de cache te wissen (toetscombinatie Ctrl + F5)

Ik beschouw deze les als voltooid, we hebben de algemene vragen over het bewerken van sjablonen in Joomla opgelost, geleerd hoe we met de paginacode moeten werken, en we hebben onze eigen stijlbestanden gemaakt en gekoppeld.
In de volgende les zullen we het proces van het bewerken van een sjabloon nader bekijken en

Een WordPress-sjabloon is een ontwerp voor een bijbehorend beheersysteem met een speciale uitstraling voor het aanpassen van websites. Dit is een volledig kant-en-klare HTML-code, met opmaakpagina's. De oplossing kan actief worden gebruikt om sites met een breed scala aan onderwerpen te maken en aan te passen.

Hoe een WordPress-sjabloon openen?

Ik wil meteen opmerken dat als je niets begrijpt van codes, CSS en HTML, je beter niets kunt proberen. Uw pogingen om de sjabloon te bewerken kunnen ertoe leiden dat de site volledig niet meer functioneert. Het is heel anders als een les duidelijk de acties en uitvoeringsstadia voorschrijft, waar staat waar te kopiëren en waar te plakken. Speel echter op veilig en maak een back-up van de gegevens (back-up) om de site op elk moment in zijn oorspronkelijke vorm te herstellen.

Hoe WordPress-sjablonen wijzigen?

Het bewerken van WordPress-sjablonen kan op verschillende manieren. Elk van hen heeft zijn eigen kenmerken en is geschikt om bepaalde wijzigingen aan te brengen. Bepaal wat u in de sjabloon wilt bewerken en kies een handige manier om dit idee te implementeren. Ik stel voor om ze allemaal te overwegen.

Een WordPress-sjabloon bewerken

1. Open uw WordPress-beheergebied.
2. Volgende selecteren Uiterlijk-editor.
3. De kolom aan de rechterkant bevat alle sjabloonbestanden die kunnen worden bewerkt. Selecteer het bestand dat je nodig hebt, wijzig het en druk op Vernieuwen.

Deze methode is handig als u kleine wijzigingen moet aanbrengen. Bewerken via het admin-paneel is snel en gemakkelijk en u hoeft geen speciale programma's te starten met het invoeren van wachtwoorden. Het enige nadeel is dat de editor geen regelnummering en codemarkering heeft, daarom zal het lastig zijn om complexe en talrijke bewerkingen uit te voeren.

Bestanden bewerken met behulp van de hostingbestandsbeheerder

Als je een goede hosting hebt met een uitstekende bestandsbeheerder en een gebruiksvriendelijke interface, kun je de sjabloon erin bewerken. Deze methode vereist ook geen extra programma's te starten, verbindingen tot stand te brengen en informatie naar een pc te kopiëren. En het belangrijkste is dat de code is gemarkeerd.

De bestanden die worden bewerkt, bevinden zich in de map: / wp-content / thema's / uw_template_name /. Open het en zoek naar het bestand dat u moet bewerken.

Een onderwerp bewerken op ftp

Als u van plan bent uw sjabloon serieus te wijzigen, gebruik dan deze methode. Het bewerken van een thema via ftp moet worden gebruikt om met meerdere bestanden tegelijk te werken die zich in verschillende mappen bevinden:

• Start je klant ftp... U kunt Total Commander of FileZilla gebruiken om de client te verbinden ftp... Controleer uw websiteverbinding en open uw sjabloonmap: / wp-content / thema's / uw_template_name /
• Kopieer het bestand dat u wilt bewerken naar een lokale schijf.
• Open dit bestand in het code-editorprogramma en u kunt veilig alle noodzakelijke wijzigingen aanbrengen.

Het zou beter zijn als de testversie van de site lokaal wordt geïnstalleerd. Hiermee kunt u zonder risico wijzigingen aanbrengen en de reeds volledig bewerkte naar hosting overzetten. Om bestanden te bewerken, raad ik aan om de gratis Kladblok ++ editor met syntaxisaccentuering. Hiermee kunt u gemakkelijk tegelijkertijd door alle themabestanden bladeren.

Geef in het menu de map op die u wilt zoeken, of een functie, of een woord of een tag, en Kladblok ++ zal onmiskenbaar bestanden tonen met vergelijkbare items. En selecteer vervolgens het bestand dat u nodig hebt en breng wijzigingen aan. Dankzij de beschikbare verlichting wordt het bewerken eenvoudiger en handiger.

conclusies

Zoals vermeld aan het begin van de post, als je niet zeker bent van je capaciteiten en twijfelt aan het succes van verdere bewerking, is het beter om dit niet aan te pakken. Maar als u begrijpt wat en hoe u moet doen, kunt u veilig aan de slag.

Bepaal hoe moeilijk het zal zijn om het thema te upgraden en bepaal de handigste bewerkingsmethode. Maar voor het geval dat, maak een reservekopie om de werkende sjabloon helemaal niet te verliezen. Als het bewerken niet is gelukt, kunt u alle gegevens herstellen en het thema in zijn oorspronkelijke vorm starten.