Van Suffusion naar Divi

1. maak een kloon van de bestaande website
2. Igv installatie in submap: stel bij instellingen in  dat het site-adres hetzelfde is als het wordpress-adres; anders kijk je nog telkens naar de originele website.
3. installeer
   • thema divi
   • child theme configurator
   • elegant themes updater
   • monarch
   • Backup/Restore Divi Theme Options
4. Check of deze beveiligings plugins erop staan
   email address encoder
5. laat de child theme configurator een child theme maken (staat onder extra/hulpmiddelen)
6. Gebruik eventueel een mooie layout van een andere divi-gebruikende website met Backup/Restore Divi Theme Options
   Let op: het webadres van het logo zelf aanpassen. Check of er in de code nog meer webadressen staan van de site waaruit je kopieert. Die moet je aanpassen, maar dan via de DIVI opties.
7. Pas ook de adressen van social media in bi Opties voor thema: algemeen

 

Waar staat: inschakelen: betekent het is ingeschakeld.

Handig om aan te passen, in te schakelen;
Datum: j M Y
Terug naar boven toets
Social media: zet uit wat je niet gebruikt. (ze staan standaard aan)

Minify And Combine Javascript Files: zet uit als je autoptimize gebruikt, want die zorgt dar al voor

Minify And Combine CSS Files: idem

 

• Builder: geavanceerd: schakel producttour uit op een site die ik alleen zelf beheer
• Layout: enkele post layout:
  Kijk of het thumbnail moet verschijnen of niet. Bij de Court Onderwater gekozen voor niet, omdat ik daar de volledige foto in de post zet. Dan zou het dubbelop zijn: thumbnail + origineel.

• algemene instellingen:
  site identiteit: FAVICON Site-iconen zijn de kleine afbeeldingen die je ziet in browser tabs, snelkoppelingen en in de WordPress mobiele apps. Upload hier een pictogram!
  Site-iconen moeten vierkant en minimaal 512 × 512 pixels zijn. Layout instellingen: wel of niet gekiste inhoud
  Layoutinstellingen:
  sectie hoogtes; stel in op 1 voor krappe marges; kolomspatiering: 2; kleur thema accent: kies een kleur; het bepaalt: …
• Typografie: kies kleur voor links ed
• Koptekst en navigatie – formaat koptekst. Wijzig hier evt menu naar zijbalk

  

  primaire menubalk: logo verbergen; of kies voor volle breedte maken, dan kan het logo er wel blijven.

  Vaste navigatie instellingen: ook hier: logo afbeelding verbergen
  Wb kleuren, misschien zelf nog meer specificeren, divi is beperkt.

  

• Koptekst en navigatie: elementen: verwijder evt social media, laat zoek icoon staan of verwijder als je daar een plugin voor gebruikt; voeg evt emailadres en tel.  nr toe

  

• Voettekst: onderkant balk: verwijder credits of schrijf er zelf iets voor in de plaats
  Knoppenstijl: maak de rand iets dikker, de letter vet; verander eventueel  de letterkleur (Als je hier niets invult, komt hier de kleur die je vastlegde bij Links)

Menu’s: hier stel je ze in.

De gratis plugin Simple lightbox loste dit op. Vertaal de Labels  even, die zijn standaard engelstalig.
Ook moest ik het vinkje verwijderen bij de DIVI Booster, item POSTS, naast:  Open linked images in a lightbox

met deze code:

/**
* This will hide the Divi "Project" post type.
* Thanks to georgiee (https://gist.github.com/EngageWP/062edef103469b1177bc#gistcomment-1801080) for his improved solution.
*/
add_filter( 'et_project_posttype_args', 'mytheme_et_project_posttype_args', 10, 1 );
function mytheme_et_project_posttype_args( $args ) {
return array_merge( $args, array(
'public' => false,
'exclude_from_search' => false,
'publicly_queryable' => false,
'show_in_nav_menus' => false,
'show_ui' => false
));
}


logo i van Divi is 93 breed, 43 hoog. bitdiepte 32

Pagina, die zijbalk moet tonen met navigatie. Ga naar de widgets en maak een nieuwe zijbalk aan, geef het de juiste naam en vul het met het juiste menu.

Maar: wil je een echte sidebar gebruiken, let dan op bij de instellingen van divi. Kan dat wel? Alleen zichtbaar als Divi niet is ingeschakeld.

Truc: sla de bestaande op als layout in de bibliotheek, stel de pagina in als gewoon en verander dan de pagina layout, Vervolgens de inhoud laden vanuit de bibliotheek.

Nog meer tips op https://www.elegantthemes.com/blog/divi-resources/how-to-remove-sidebars-from-divi

Pagina met lijsten van list cat. post:
gebruik de blog module van Divi, en evt in zijbalk de code van de listcategoryposts, maar dan alleen de titel.
Bij de blog module:
aantal posts; standaard 10, wijzig evt in 20
j M Y
Laat uittreksel zien
Ontwerp: kies voor raster of vollebreedte (vollebreedte = standaard)
Laag met uitgelichte afbeelding: uitgezet, geeft lelijke witte waas, die pas verdwijnt als je er overheen gaat met de muis

Installeer de plugin elegant themes updater en vul code in tbv automatische udates; haal per site een nieuwe op bij elegant themes

Let op dat je deze op 2 plekken uitschakelt voor mobiele weergave: in de hoofdmodule maar ook in de slider zelf (beide bij geavanceerd)

maakt dat plaatje als thumbnail wordt getoond met witte waas; klik erop en hij wordt groot. Ik koos er bij Hdecourtonderwater voor om het uit te zetten. Mooier zonder..

Divi heeft hiervoor de plugin Monarch. Kies zelf welke social media en waar de balk moet komen te staan

Bij het maken van de accordion gebeurde wat vreemds: soms liet hij de titel niet zien. Wat uiteindelijk hielp: alle plugins even uitzetten. Dat doe ik via ftp: ik verplaats ze naar een map (a_niet). Toen zag ik dat het er wel netjes uitzag. Bij terugplaatsen van de plugins ging het op een gegevens moment mis. Fout zat hem in: Responsive Lightbox & Gallery

Foobox, Responsive Lightbox & Gallery, Responsive Lightbox.
Check of gebruikt: Photonic Gallery for Flickr, Picasa, SmugMug, 500px, Zenfolio and Instagram
Niet nodig als ook Autoptimize in gebruik is: WP Resources URL Optimization