Thema ombouwen met een afbeelding in de Header

Gepubliceerd 10 februari 2020

OEFENING

Het is in het thema Genlike mogelijk om een afbeelding in de Header te plaatsen.

Tip: Aanbevolen wordt een afbeelding van plm. 1900px breed en plm. 300px hoog. Pas de code height:258px; (onder .sdb-header) aan op de gewenste pixelhoogte van de afbeelding.

Op de training (vanaf Maart 2020) wordt uitgelegd hoe de Header-afbeelding per page of bericht kan variëren.

Dit zijn de CSS codes om de Header van het Thema 1508_Genlike in te stellen als dit voorbeeld:


/* Header aanpassen */
.sdb-header{background-image: url(https://wp-flevoland.nl/wp/wp-content/uploads/2019/10/emmeloord1.jpg); height:258px;}
/* Zoekvak verbergen */
.sdb-header form.sdb-search{visibility:hidden;}
/* Titel aanpassen in Header */
.sdb-headline, .sdb-headline a, .sdb-headline a:link, .sdb-headline a:visited, .sdb-headline a:hover {color:#fff !important; font-weight:700; text-shadow: 1px 1px 2px #111;}
/* Slogan aanpassen in Header */
.sdb-slogan, .sdb-slogan a, .sdb-slogan a:link, .sdb-slogan a:visited, .sdb-slogan a:hover {color:#fff !important; top:115px !important; font-weight:600; text-shadow: 1px 1px 3px #000;}

 

Let op:

Als de achtergrondfoto niet getoond wordt, plaats dan de link van de afbeelding tussen aanhalingstekens als: “https://etc….”

Galerij aanmaken in WordPress

Gepubliceerd 30 januari 2020

In deze Demo zie je een voorbeeld van hoe je een Galerij kunt aanmaken in een bepaalde pagina.

Deze optie is standaard in WordPress ingebouwd, dus hoeft er niets extra’s geïnstalleerd te worden.

Er zijn wel speciale Gallery plugins, met extra aanvullingen, zoals Nextgen waarmee galerijen bewerken meer uitgebreid kan worden. Maar voor een standaard galerij is dat niet echt nodig.

Zie clip voor meer uitleg. Tip: De clip kan rechtsonder in de clip vergroot worden tot ware schermgrootte.

 

 

NB: In de clip wordt uitgelegd dat de standaard afmetingen van de Thumbnails 150px X 150px is.
Deze standaard afmetingen kunnen gewijzigd worden in andere afmetingen op:
Dashboard > Instellingen > Media: Thumbnailgrootte

TIP: Er zijn ook Plugins die de afmetingen van de huidige Thumbnails kunnen wijzigen: zoek bij Nieuwe Plugins op “Resize Thumbnails”.
Dashboard > Plugins > Nieuwe Plugin > Trefwoord: “Resize Thumbnails”

Demo: Slider maken

Gepubliceerd 6 november 2019

 
Het is mogelijk om een Slider te maken en in de header van het Thema 1508_genlike te plaatsen.

Daarnaast kan een Slider ook ergens willekeurig op de Website geplaats worden in alle afmetingen en stijlen in elke pagina en/of bericht.

Ik heb een Demo filmpje gemaakt over hoe je een Slider kunt maken en eventueel in de Header kunt plaatsen.

 
Demo: Hoe een Slider maken met meerdere Slides

 
Hieronder heb ik ook enkele links van voorbeelden van Sliders.

Voorbeelden van Avartan Sliders

 

Contact-form beveiligen

Gepubliceerd 30 oktober 2019

[honeypot honeypot-876]

Voor veiligheid invullen s.v.p.: [quiz quiz-514 “1 + 3 = | 4” “2 + 6 = | 8” “3 + 2 = | 5”] [submit class:sdb-button “Verzenden”]

In de Workshop wordt dit verder behandeld.

Een nieuw bericht plaatsen via een E-mail bericht

Gepubliceerd 16 oktober 2019

Dit is een testbericht via email verstuurt.

Het is mogelijk om via een email bericht een bericht te plaatsen. Hier zijn wel wat risico’s aan verbonden, die eventueel in onze trainingen besproken kunnen worden.

Met de plugin Postie is het mogelijk diverse extra opties en functies toe te passen.

Bent u deelnemer van onze trainingen en u wilt meer weten over deze optie, laat het dan de groepsleider weten.

Responsive Test: Is uw website Responsive?

Gepubliceerd 28 maart 2018

Er zijn verschillende media die door bezoekers gebruikt worden om uw website te bezoeken.

Dat gaat van Desktop Computer tot Mobiele telefoons, alleen met een eigen schermafmeting.

Vele WordPress thema’s zijn Responsive thema’s die zich automatisch aanpassen aan het beeldscherm van de bezoeker.

Maar let op, niet alle thema’s zijn Responsive. Dit geld vooral voor de oudere thema’s.

U kunt uw website testen om te zien of deze wel goed responsive is op: www.responsivedesignchecker.com

Kleur van de Menubalk veranderen

Gepubliceerd 22 maart 2018

Om de standaard kleur van de Menubalk (navigatiebalk) te veranderen, kan de CSS instellingen aangepast worden.

Dat kan op de volgende manier.

Ga in het Dashboard naar: Weergave > Customizer > Extra CSS.

Hier kan de volgende code geplakt worden:

.sdb-nav{background:#007F7B}
ul.sdb-hmenu ul li a:hover, .desktop ul.sdb-hmenu ul li:hover > a {background:#00524F}
ul.sdb-hmenu li li a {background:#007F7B}
.tiny.sdb-nav{background:#00524F}

In deze code staat de kleurcode van de Menubalk op #007F7B, maar dat kan aangepast worden.

Er is op onze website ook een Kleur picker om de juiste kleur te kiezen.
Ga hiervoor naar: www.wp-flevoland.nl/color

Uitleg van de code:

.sdb-nav{background:#007F7B}
Dit is de achtergrondkleur van de hele Menubalk.

ul.sdb-hmenu ul li a:hover, .desktop ul.sdb-hmenu ul li:hover > a {background:#00524F}
Hier wordt de “hover” kleur gegeven van de knoppen in de Menubalk. – (hover = als de muispijl er overheen gaat)

ul.sdb-hmenu li li a {background:#007F7B}
Met deze code wordt de achtergrondkleur van de knoppen op de Menubalk aangegeven.
In dit geval de zelfde kleur als van de Menubalk zelf (probeer eens dit te wijzigen)

.tiny.sdb-nav{background:#00524F}
Met “.tiny” voor de code “.sdb-nav” wordt de kleur bepaald voor de Menubalk als de balk verkleind wordt.
De Menubalk wordt van hoogte verkleind en blijft bovenin het scherm staan als de pagina naar beneden gescrold wordt.

Sucuri Plugin voor WordPress Integrity

Gepubliceerd 22 februari 2018

Sucuri is een goede Plugin waarmee alle veranderingen van de WP bestanden worden gevolgd.

Als een WP bestand afwijkt van het originele WP bestand wordt daar melding van gemaakt. Met slechts een muisklik kan een gewijzigd bestand weer hersteld worden naar het WP originele bestand.

Daarnaast wordt er een Logboek bijgehouden, waarin alle logins, wijzigingen en handelingen vermeld wordt.

Deze plugin is ideaal om het hacken van de website tegen te gaan en eventueel te herstellen.

Meer info over de Sucuri plugin

In de cursus worden meerdere Plugins en tips besproken om het hacken van de website tegen te gaan.

NB: dit bericht is een aanvulling op het gesprek van de WordPress lesavond van 21 februari 2018.

WordPress Training Oktober 2017

Gepubliceerd 15 november 2017

De Header Foto op eigen website plaatsen

  1. Ga in uw Dashboard naar: Media, Nieuw Bestand
  2. Kies eventueel bij de Brouwser uploader voor de optie: “Schakel om naar de nieuwe uploader” (indien zichtbaar)
  3. Sleep de foto naar het venster.

Klaar!

 

NB:

Meer info om de afbeelding als headerafbeelding te gebruiken ga naar: www.wp-flevoland.nl/header-afbeelding-plaatsen

WordPress Handleiding

Hier kunt u gratis een WordPress Handleiding Downloaden  (Alternatieve link)

 

CSS Websites

www.w3schools.com/css/
https://www.handleidinghtml.nl/css/

 

Afbeeldingen

Import afbeeldingen plugin:

Save & Import Image from URL

 

YouTube clips in WordPress

Gepubliceerd 7 november 2017

Het is mogelijk om een YouTube clip in je website te tonen, door enkel het URL adres van de clip in een bericht of pagina te plakken.

Zie voorbeeld:

https://www.youtube.com/watch?v=JutLU4HMmEA   (URL link kopiëren en plakken)

Afmetingen van de clip aanpassen

De afmetingen van de clip aanpassen kan bij YouTube. Dan wordt het een IFRAME code, die geplakt kan worden.

Optie: Delen, Insluiten, Videoformaat (aanpassen naar gewenste maat)

Let op: Complete IFRAME code plakken met de Editor in de Tekst mode, dus niet in de Visual mode (rechtsboven de werkbalk van de Editor)

Zie voorbeeld: (400px breed)

 

WordPress Training & Workshop voor Ondernemers in Flevoland

Gepubliceerd 16 september 2017

WordPress

In samenwerking met de bibliotheken in de provincie Flevoland, FlevoMeer Bibliotheek, organiseren we regelmatig workshops/trainingen voor ondernemers en starters om een eigen website te maken en/of te beheren.

We werken met het populaire en gebruikersvriendelijke CMS systeem WordPress. WordPress is een Content Manage Systeem (CMS) waarmee makkelijk een website opgebouwd en beheerd kan worden. Doormiddel van aanvullende Plugin’s kan de website ten alle tijd uitgebreid worden tot een volwaardige Dynamische Website, Weblog of Webshop. WordPress is een CMS systeem dat gratis gedownload kan worden. In onze trainingen leert u vele ins & outs van dit systeem.

Onze trainingen zijn voor 2017 gepland in Emmeloord en Zeewolde. De trainingen bestaan uit 4 maal een avond in de week van 2 uren. Dus 4 X 2 lesuren. Binnenkort hopen we informatie te geven over 2018.

Voor meer informatie en aanmelding kunt u gaan naar de Website van Flevomeer Bibliotheek.

Daarnaast geven wij ook individuele trainingen voor ondernemers, starters, verenigingen en particulieren. Voor meer informatie kunt u vrijblijvend bellen naar (0527) 652820 of ons schrijven via ons Contactformulier.

WP-Flevoland is een initiatief van  PlusComp Computertrainingen & Webdesign.

De WordPress Workshops in de Bibliotheken is een initiatief van Flevomeer Bibliotheek.

 

Extra Veld om Tiny Navigator uit te zetten in het 1508 Genlike Thema

Gepubliceerd 12 september 2017

Bij het 1508 Genlike Thema veranderd bij het scrollen de navigatie balk naar een kleinere navigatie balk toe, die dan bovenin het scherm stil blijft staan.

Deze optie kan uitgezet worden per pagina of bericht via een Extra veld te maken.

De naam van dit Extra veld moet zijn: Tini Nav

De waarde om het uit te zetten moet zijn: Nee

Let op: Beide waarden zijn Hoofdletter gevoelig

Dat is voldoende om de Tiny navigator uit te zetten.

NB: Het kan wel eens gebeuren dat het resultaat nog niet direct zichtbaar is i.v.m. het Cache geheugen!

 

Header afbeelding plaatsen in 1508_Genlike

Gepubliceerd 10 november 2016

In het oefen thema 1508_Genlike is een optie om per pagina of bericht een afbeelding in de Header te plaatsen.

De afbeelding wordt dan geplaatst onder de Menubalk over de totale breedte van het scherm. Zie boven in de pagina van dit bericht.

U kunt dat doen door in de Editor onder de optie Extra velden een veld aan te maken (Nieuwe toevoegen) met de naam “Header afbeelding” (letterlijk overnemen en zonder aanhalingstekens) en dan als waarde het complete Internetadres van de afbeelding (URL) in te vullen. Lees verder →

Contactformulier Verzendknop aanpassen aan uw Thema

Gepubliceerd 28 mei 2016

Het is mogelijk om de Verzendknop van het Contactformulier van de plugin Contact Form 7 aan te passen aan uw Thema.

Dat kunt u doen door in uw Dashboard te gaan naar Contact > Contactformulieren en dan te kiezen voor Bewerken.

De optie “Bewerken” verschijnt wanneer u de muispijl op de titel van het formulier plaatst.

Lees verder →

Header van Thema 1508_Genlike verwijderen

Gepubliceerd 27 mei 2016

De Header van het (oefen) Thema 1508_Genlike is  per pagina te verbergen door het vinkje te verwijderen bij de optie “Show Header on Page” onder “Theme Options” in de Page Editor.

Maar bij de berichten wordt de Header wel getoond. Hier is de bovengenoemde optie niet aanwezig om de Header te verbergen. Om toch de Header ook bij de berichten te verbergen, kunt u overwegen de code, die de Header toont, in zijn geheel te verwijderen. Lees verder →

Hallo wereld.

Gepubliceerd 24 mei 2016

Welkom op deze Website. Hier komen binnenkort allerlei Nieuwtjes, Tips & Trucs te staan over WordPress Websites en onze Trainingen & Wordkshops.

We hopen U binnenkort te ontmoeten op één van onze WordPress Trainingen of Workshops, die we regelmatig geven in de provincie Flevoland, op locatie of in ons Computerlokaal. Wij geven ook individuele trainingen voor WordPress, WP Thema’s Ontwikkelen, MsOffice (Word, Excel), Photoshop, etc.

Heeft u vragen? Bel ons gerust en vrijblijvend op (0527) 652820 of laat een bericht achter via ons Contactformulier

Meest recente berichten

Categorieën