1. Installatie

Ik neem aan dat je al een nieuwe versie van WordPress op je server hebt geïnstalleerd.

Download het thema zip-bestand
Het eerste dat u moet doen, is het zip-bestand met de thema-installatie downloaden.

Installeer het thema
U kunt het GymPress WP-thema op twee verschillende manieren installeren:

1. Upload een zip-bestand – voorkeursmethode
   Wanneer u bent ingelogd op uw WordPress-dashboard, gaat u naar Uiterlijk »Thema’s» Nieuw toevoegen »Thema uploaden en selecteer het zip-bestand gympress-pt.zip je hebt gedownload van onze winkel of van het ThemeForest en klik op Installeer nu knop.
2. FTP-upload
   Pak de inhoud van de gympress-pt.zip bestand en upload de map met de naam gympress-pt naar uw server wp-uploads / thema's / map met een FTP-client.

Zodra uw thema op de server staat, activeert u het door op te klikken Activeren knop onder de voorbeeldafbeelding in Uiterlijk »Thema’s

Gefeliciteerd! Nu is het GymPress WP-thema geïnstalleerd.

2. Pas het uiterlijk aan

U kunt het uiterlijk van het GymPress WP-thema volledig aanpassen. Ga naar het uiterlijk »Thema’s en klik op de Aanpassen knop:

Het nieuwe venster verschijnt en u kunt nu het uiterlijk van uw thema aanpassen – upload uw aangepaste logo, wijzig de basiskleuren, schakel themafuncties in / uit, voeg aangepaste CSS of Javascript toe enz..

3. Democontent

One Click Demo Install

U kunt democontent importeren van onze demosite (met wazige gelicentieerde afbeeldingen) met een enkele klik op de knop. Ga naar Uiterlijk »Demogegevens importeren en klik op de importknop.

XML-bestand importeren

Als u de demo-inhoud op de ouderwetse manier wilt importeren, kunt u een nieuwe kopie van de XML-bestand op onze server op deze URL: http://artifacts.proteusthemes.com/xml-exports/gympress-latest.xml. Vergeet niet alle vereiste plug-ins te activeren voordat u demogegevens importeert. Ga naar om de demogegevens te importeren Hulpmiddelen »Importeren, Klik op WordPress (installeer de WordPress importeur plug-in als deze nog niet is geïnstalleerd) en upload / importeer het eerder opgeslagen XML-bestand (vergeet niet om de Download en importeer bestandsbijlagen checkbox om ook de afbeeldingen te importeren).

Demowidgets
Nadat u de demo-inhoud heeft geïmporteerd, kunt u ook op de ouderwetse manier widgets importeren. Het bestand voor het importeren van widgets bevindt zich ook op onze server: http://artifacts.proteusthemes.com/json-widgets/gympress.json. Hernoem dit bestand naar gympress.wie (let op de bestandsextensie) en gebruik deze in de plug-in Widget Importer & Exporter. Ga naar Hulpmiddelen »Widget importeren / exporteren en importeer het bestand.

Na het importeren instellen
Nadat u de demogegevens en widgets hebt geïmporteerd, moet u ook deze dingen instellen:

• ga naar Instellingen »Lezen, stel de Voorpagina wordt weergegeven naar een statische pagina en selecteer de voorpagina en de blogpagina in de juiste vervolgkeuzelijsten,
• ga naar Uiterlijk »Menu’s, selecteer het hoofdmenu in de vervolgkeuzelijst bovenaan en klik op Selecteer. Scroll naar beneden en stel de Thema locatie naar Hoofdmenu (als er meer locaties zijn, kunt u ook andere menu’s aan die locaties toewijzen),
• ga naar Uiterlijk »Widgets, En instellen Aangepaste menu widgets door het juiste menu te selecteren (in voettekst en Onze diensten zijbalken),
• optioneel andere dingen instellen (zoals logo, kleuren, …). Deze instellingen zijn te vinden in Uiterlijk »Aanpassen.

4. Koptekst

Bovenste balk

In GymPress vindt u een zeer aanpasbare Top Bar-ruimte. Zowel de linker- als de rechterbovenkant zijn gemaakt met widgets die hier kunnen worden toegevoegd of verwijderd – Uiterlijk »Widgets» Linksboven of Rechtsboven.

Ondersteunde widgets op de bovenste balk:

• Icon Box
• Sociale pictogrammen
• Aangepaste menu
• Tekstwidget

Logo

Het logo kan worden gewijzigd in onze Thema-opties – Uiterlijk »Aanpassen» Thema-opties »Logo.

Favicon

Sinds WordPress versie 4.3 is de favicon-instelling te vinden in Uiterlijk »Aanpassen» Site-identiteit, waar u de Site Icoon keuze.

Hoofdmenu

Het hoofdmenu kan worden ingesteld wp-admin »Uiterlijk» Menu’s. Themalocaties voor het Hoofdmenu worden Hoofdmenu genoemd.

Speciaal dropdownmenu

GymPress zit vol met handige functies en het speciale dropdown-menu is niet anders. Het is perfect om uw personeel in uw menu te presenteren voor een persoonlijker tintje.

Het toevoegen van een speciale vervolgkeuzelijst op uw site is heel eenvoudig. Eerst moet je aanbevolen afbeeldingen toevoegen (aanbevolen formaat is 90x90px) op elke pagina die je wilt linken in de vervolgkeuzelijst. In ons geval gebruiken we single trainer-pagina’s.

Zodra u alle pagina’s gereed heeft, moet u deze toevoegen pt-special-dropdown klasse in de bovenliggende link. Als u het veld voor CSS-klassen niet ziet, moet u op de schermopties bovenaan de pagina klikken en het selectievakje CSS-klassen aanvinken.

5. Pagina’s

wp-admin »Pagina’s is het gebied waar u de meeste tijd zult doorbrengen bij het bouwen van een site. We hebben in dat proces een paar tools toegevoegd, zodat u uw pagina’s gemakkelijker en sneller kunt maken.

Paginasjablonen

U kunt kiezen uit 3 verschillende sjablonen – Standaardsjabloon, Voorpagina met schuifregelaar en Voorpagina met schuifregelaar voor laag / revolutie.

Standaardsjabloon: Gewoon een standaardsjabloon voor eenvoudige lay-outs en Page Builder. Eerst moet u de optie Paginabuilder kiezen onder de titel en u bent klaar om te gaan. U kunt hier onze widgets toevoegen, verschillende visuele stijlen kiezen en nog veel meer. Daarover meer in het volgende hoofdstuk. Eerst moet je de Page Builder optie kiezen onder de titel en je bent klaar om te gaan. U kunt hier onze widgets toevoegen, verschillende visuele stijlen kiezen en nog veel meer. Daarover meer in het volgende hoofdstuk.

Voorpagina met schuifregelaar: Dit is een unieke sjabloon die een optie voor een schuifregelaar toevoegt aan de pagina-opties. Het kan worden gebruikt met Page Builder. Meer daarover in het hoofdstuk Slider.

Voorpagina met Layer / Revolution Slider: We voegen deze twee schuifplug-ins niet toe aan het thema, maar we zorgen ervoor dat ze goed werken, omdat we weten dat onze klanten ze willen gebruiken. Wanneer u deze sjabloon activeert, is er een nieuwe Pagina schuifregelaar metabox waarin je ID / alias van Layer / Revolution Slider kunt plaatsen.

Page Builder

Page Builder is een zeer krachtig hulpmiddel voor het maken van pagina’s. Hier is een voorbeeld van hoe het eruit ziet:

Je kunt elk soort raster maken door nieuwe rijen toe te voegen en daarin plaats je widgets. Als je klaar bent met het toevoegen van widgets, kun je ook hele rijen op en neer bewegen.

Ga voor meer informatie over het gebruik van Page Builder naar Page Builder by SiteOrigin documentatiepagina.

Je moet ook deze geweldige korte videocursus bekijken: Page Builder Tips.

Page Builder Rijstijl

Laten we eens kijken hoe we Page Builder-rijen kunnen opmaken.

Om te beginnen moeten we klikken op “Rij bewerken” voor de rij die we willen stylen, zoals weergegeven in de afbeelding hierboven. Een venster “Rij bewerken” wordt geopend en aan de rechterkant zijn er drie tabbladen met instellingen: Attributen, Indeling en Ontwerp. Hier kunt u verschillende dingen aanpassen voor deze specifieke rij.

In de Indeling tabblad kunt u de De ondergrens, Vulling en verander de Rij-indeling naar Volledige breedte. In de Ontwerp tabblad kunt u de Achtergrond kleur, Achtergrond afbeelding en andere dingen.

Page Builder Widgets

U kunt bijna elke widget in Page Builder gebruiken. Laten we een paar niet zo eenvoudige bekijken.

SiteOrigin Editor Widget

SiteOrigin Editor creëert voor u dezelfde editoromgeving als een normale WordPress-editor. U kunt deze widget gebruiken als u normale tekstbewerkingsopties wilt. De SiteOrigin Editor Widget maakt deel uit van Site Origin Widgets-bundel.

Call to Action Widget

Hoe voeg ik een knop toe? Met onze aangepaste shortcodes. U vindt instructies in het gedeelte Knoppen.

Uitgelichte pagina-widget

Aanbevolen pagina is een heel eenvoudige widget die we gebruiken in Page Builder. Het enige wat u hoeft te doen is de pagina en een van de twee lay-outs te selecteren die we voor u hebben gemaakt.

Maar hoe verander ik de afbeelding en tekst op de voorpagina?

De afbeelding op de voorpagina is gewoon normaal Uitgelichte afbeelding van de geselecteerde pagina. Je kunt dat wijzigen in de zijbalk van elke afzonderlijke pagina. Tekst kan worden gewijzigd in de Fragment veld die u kunt vinden aan het einde van de pagina-instellingen. Als het uittrekselveld er niet is, moet u op de klikken Schermoptie (bovenaan de pagina) en vink Fragment aan. Bekijk de onderstaande schermafbeelding voor meer informatie.

MailChimp abonneren

De widget MailChimp Abonneren helpt u bij het verzamelen van e-mails van uw potentiële klanten, zodat u hen een nieuwsbrief of een promotie-aanbieding kunt e-mailen en zo uw winst kunt vergroten. Hier is een voorbeeld van de MailChimp-abonneerwidget (in de voettekst).

Deze widget is eenvoudig in te stellen. Volg gewoon de instructies in de widget:

1. Bezoek deze URL en log in met uw mailchimp-account,
2. Maak een API-sleutel en plak deze in de MailChimp API-sleutel invoer veld,
3. Klik op de knop Verbinden, zodat uw bestaande MailChimp-lijsten kunnen worden opgehaald,
4. Selecteer in het vervolgkeuzemenu op welke lijst u uw bezoekers wilt abonneren,
5. Sla de widget op en werk de pagina bij.

Dat is het! Het inschrijfformulier wordt automatisch gegenereerd (e-mailveld en een verzendknop) en u kunt e-mails verzamelen.

6. Schuif

Het bouwen van een thema-schuif was nog nooit zo eenvoudig. U kunt op elke gewenste pagina een thema-schuifregelaar maken.

Installeer de ProteusThemes Shortcodes plugin en ACF Repeater (Te vinden in de themamap in / gebundelde plug-ins /). Het enige dat u hoeft te doen, is de paginasjabloon kiezen Voorpagina met schuifregelaar (u kunt deze sjabloon ook gebruiken als deze niet voor de voorpagina is). Nadat u deze paginasjabloon hebt geselecteerd, verschijnt er een nieuwe metabox onder aan de pagina die wordt aangeroepen Voorpagina slider. Nu kunt u afbeeldingen of video’s aan uw slider toevoegen.

Wanneer u een video toevoegt, moet u ook een videominiatuur uploaden, die zal dienen als een klikbaar gebied (er zal ook een afspeelknop-overlay aan deze afbeelding worden toegevoegd). Wanneer een gebruiker op deze afbeelding klikt, wordt de video geopend in een pop-up modaal venster.

Zoals je kunt zien op de voorbeeldafbeelding hieronder, heb je ook de Schuifinstellingen tabblad. Op het tabblad Schuifinstellingen kunt u het gedrag van de schuifregelaar wijzigen en de schuifregelaaropties wijzigen.

Zo ziet de backend van de schuifregelaar eruit:

Bekijk dit artikel over de afmetingen van de schuifregelaar voor de aanbevolen grootte van de schuifregelaarafbeeldingen voor dit thema.

7. ProteusThemes-opties

Je kunt alles vinden thema opties in de Customizer: Uiterlijk »Aanpassen. Dit is een live preview-editor voor uw pagina.

Hier kunt u wijzigen:

• Logo
• Koptekst
• Navigatie
• Sticky Menu
• Paginakoptekst
• Thema-indeling en kleuren
• Voettekst
• Aangepaste code
• En veel meer …

8. Shortcodes

Toetsen

Voor het toevoegen van knoppen moet u de shortcode van de knop gebruiken, die er als volgt uitziet: Uw tekst [/ button]
Er zijn 7 opties met verschillende attributen – stijl, href, doelwit, fa, hoeken, volledige breedte en klasse.

Tekst: U kunt de tekst van de knop wijzigen.
Voorbeeld: Nieuwe tekst [/ button]

Stijl: Je kunt kiezen uit een paar stijlen – primair, ondergeschikt, Gevaar, succes, info of standaard.
Voorbeeld: Uw tekst [/ button]

Href: U kunt een URL toevoegen aan de knop.
Voorbeeld: Jouw tekst [/ button]

Doelwit: U kunt kiezen of u de link op dezelfde manier wilt openen – “_zelf” of nieuw – “_blanco” venster.
Voorbeeld: Uw tekst [/ button]

Font Awesome-pictogram: U kunt een geweldig lettertype-pictogram toevoegen aan de knop.
Voorbeeld: Uw tekst [/ button]

Volledige breedte: U kunt uw knoop over de volledige breedte uitrekken.
Voorbeeld: Uw tekst [/ button]

Klasse: Je kunt extra aangepaste klassen toevoegen aan de knop.
Voorbeeld: Jouw tekst [/ button]

Pictogrammen – Font Awesome

Shortcode voor Font Awesome lijkt erg op de shortcode van de knoppen. Het ziet er zo uit: [fa]
Er zijn 3 opties met verschillende attributen – icoon, href, doelwit en kleur.

Icoon: U kunt elk 519 FontAwesome-pictogram gebruiken. Om het geselecteerde pictogram in te stellen, haalt u gewoon de titel van het pictogram op, bijvoorbeeld “fa-phone”.
Voorbeeld: [fa icon = "fa-phone"]

Href: U kunt een URL toevoegen aan het pictogram.
Voorbeeld: [fa href = "http://www.proteusthemes.com"]

Doelwit: U kunt kiezen of u de link op dezelfde manier wilt openen – “_zelf” of nieuw – “_blanco” venster.
Voorbeeld: [fa target = "_ blank"]

Kleur: U kunt een aangepaste kleur instellen voor uw pictogram.
Voorbeeld: [fa color = "# ff00ff"]

Dus een shortcode voor een Font Awesome-pictogram met een startpictogram, linken naar een pagina en openen in een nieuw venster / tabblad ziet er als volgt uit: [fa icon = "fa-home" href = "http://www.proteusthemes.com" target = "_ blank"]

9. Plug-ins

We gebruiken en ondersteunen ook enkele van de beste plug-ins voor WordPress.

Vereiste en aanbevolen plug-ins

U kunt deze plug-ins installeren en activeren door naar te gaan wp-admin »Uiterlijk» Plug-ins installeren.

De lijst met vereiste en aanbevolen plug-ins die in dit thema worden gebruikt:

• Geavanceerde aangepaste velden
• ACF Repeater Field (gebundeld)
• ProteusThemes Shortcodes
• Page Builder door SiteOrigin
• SiteOrigin Widgets-bundel
• Demo importeren met één klik
• Contactformulier 7
• WP Featherlight
• Breadcrumb NavXT
• Aangepaste zijbalken van ProteusThemes

Contactformulier 7

We gebruiken Contactformulier 7 voor onze Contactpagina. Dit is de code van onze demo:

[tekst * uw-naamklasse: tijdelijke aanduiding voor formuliercontrole "Voornaam *"]


[tekst * uw-achternaam-klasse: tijdelijke aanduiding voor formuliercontrole "Achternaam"]


[email * your-email class: placeholder voor formuliercontrole "E-mail *"]


[textarea your-message class: form-control placeholder "Message"] [submit class: btn class: btn-primary "Send Message"]

Daarna plaatst u de shortcode van de plug-in in uw contactpagina.

WooCommerce

Dit thema ondersteunt standaard WooCommerce-integratie.

Zodra WooCommerce is geactiveerd, ziet u deze melding:

Klik op Voer de installatiewizard uit knop om de WooCommerce-installatie te starten. Dat zal de installatiewizard starten, waar u zaken als kunt instellen winkel pagina’s, landinstelling opslaan, verzendkosten & belasting en betalingen.

Als u enkele instellingen wilt wijzigen, kunt u deze wijzigen in WooCommerce »Instellingen. Er zijn veel tabbladen bovenaan die u naar eigen inzicht kunt configureren.

De meeste van onze thema’s worden geleverd met onze eigen demo-producten voor de WooCommerce-winkel en worden automatisch geïmporteerd wanneer u de demo-inhoud importeert met behulp van onze toonaangevende One Click Demo Import-plug-in. U moet ervoor zorgen dat WooCommerce wordt geactiveerd op het moment dat u de demogegevens importeert.

U kunt echter (optioneel) de aanvullende demo-producten van WooCommerce installeren. Ga naar Hulpmiddelen »Importeren» WordPress en importeer het demo XML-bestand dat u kunt vinden in de map waar WooCommerce op uw server is geïnstalleerd. Meestal is dit binnen wp-content / plugins / woocommerce / dummy-data / dummy-data.xml. Controleer ook de Download en importeer bestandsbijlagen selectievakje, zodat alle productafbeeldingen ook worden gedownload.

Als je klaar bent, zou je de producten moeten zien:

Ga naar als u klaar bent met de instellingen Uiterlijk »Widgets.

Sleep de WooCommerce-widgets die beginnen met “WooCommerce” naar de opgeroepen zijbalk Winkel zijbalk.

Dat is alles, uw WooCommerce-winkel is nu klaar!

Paneermeel NavXT

De broodkruimels in dit thema worden mogelijk gemaakt door de Paneermeel NavXT inpluggen.

Alle instellingen voor paneermeel zijn te vinden in Instellingen »Breadcrumbs NavXT. Wanneer u deze instellingenpagina voor het eerst opent, is er mogelijk een melding met een link Migreer nu klik er aan het einde op en het brengt u naar de juiste instellingenpagina. Hier kunt u een scheidingsteken definiëren (dat standaard leeg moet zijn voor onze thema’s), breadcrumb-hiërarchieën voor verschillende pagina’s (pagina’s, aangepaste berichttypen, taxonomie, …) en andere breadcrumbs-gerelateerde dingen instellen.

Standaardproduct breadcrumbs

Laten we eens kijken hoe u de standaard broodkruimels instelt die voor dit thema voor dit thema worden gebruikt Producten aangepast berichttype. Ga naar Instellingen »Breadcrumbs NavXT en klik op de Berichttypen tabblad. Scroll naar beneden naar de Product sectie en stel de Product hoofdpagina naar Winkel pagina en aangezien we de root-pagina hebben ingesteld, kunnen we ook de uitschakelen (deselecteren) Productarchiefweergave checkbox. Vergeet niet de instellingen op te slaan.

10. Voettekst

Last but not least is er onze voettekst. Het voettekstgebied is onderverdeeld in:

Footer Widgets

Footer Widgets is de plaats waar u de laatste dingen aan uw pagina kunt toevoegen. U kunt widgets toevoegen in de Apperance »Widgets» Voettekst. Er zijn ook weinig opties voor dat gebied in Uiterlijk »Aanpassen» Thema-opties »Voettekst. U kunt daar verschillende kleuren wijzigen.

Onderste voettekst

Het onderste voettekstgebied is de plaats voor auteursrechten of een aangepaste tekst. Aangepaste tekst voor de linker- en rechterkant van de onderste voettekst kan worden toegevoegd in live customizer Uiterlijk »Aanpassen» Thema-opties »Voettekst.

11. Vertalingen

Handmatige vertaling

We hebben een artikel met de video over het vertalen van onze thema’s die op deze link zijn gepubliceerd.

WPML voor meertalige sites

Dit thema ondersteunt WPML officieel. Ga naar de WPML-website, koop het abonnement en download en installeer de volgende plug-ins:

• WPML meertalig CMS
• WPML String-vertaling
• WPML-vertaalbeheer

Daarna zal de WPML-wizard u begeleiden om de meertalige site correct te configureren.

Ter referentie: de widgets en thema-opties kunnen alleen worden vertaald met de String Translation.

12. Extra’s

Demo-afbeeldingen

Alle afbeeldingen die in GymPress WP worden gebruikt, zijn te vinden op Shutterstock.