Logo Magzmaker


Tekst

  • Op een pagina in bewerk-modus voeg je het contentblok Tekstblok toe. Als je een tekst wilt vervangen of aanpassen, open je het betreffende tekstblok door op het  potloodje te klikken; kies Instellen.
  • Een contentblok staat altijd in een sectie. Als je begonnen bent met een lege pagina voeg dan eerst een sectie toe om daarna een Tekstblok toe te kunnen voegen. Lees hier meer over secties en hoe je die toevoegt.
Letters AAA


Tekstblok toevoegen

Nieuwe tekst toevoegen of bestaande tekst aanpassen

Ga naar de pagina waarop je de tekst wilt toevoegen of aanpassen en zorg dat de pagina in bewerk-modus staat. Bovenin de paarse balk kun je klikken op Terug naar bewerken om de pagina in bewerk-modus te zetten. Je ziet nu de hulp-lijnen van de secties op de pagina. Rechts van elk content-blok wordt de bewerk-knop  zichtbaar wanneer je met de muis over het betreffende blok gaat.

  • Klik binnen een sectie op + Add block en kies het content-blok Tekstblok. 
  • Het blok wordt aangemaakt en in het editscherm dat nu opent zie je de tekst-editor.
  • Typ hierin de tekst of je knipt en plakt de tekst uit een tekstbestand zoals bijv. Word via CTRL-V. Opmaak die er niet in hoort wordt er bij het plakken uitgehaald, maar een enkele keer kan er wat opmaak uit het bronbestand meekomen. Als dit  gebeurt kun je de tekst eerst in bijv. Notepad plakken zodat alle opmaak eraf is en van daaruit weer in de tekst-editor van Magzmaker plakken.
  • In de tekst-editor kun je de tekst opmaken, zie tekst bewerken

Tekst bewerken

In de tekst-editor kun je de tekst opmaken met de opmaakfuncties in de balk aan de bovenkant. Het spreekt waarschijnlijk voor zich: selecteer een stukje tekst en kies bold, italic, onderlijnen, opsomming enz. 

  • Koppen: selecteer het stuk tekst wat de kop moet worden en kies een kop (Normaal, Kop1, Kop2, Kop3 enz.) uit de dropdown Opmaak.
    Het lettertype, de grootte en kleur van de koppen is ingesteld in de editie-instellingen, lees hierover meer in de pagina over de editie-instellingen onder het kopje Fonts en tekststijlen.
    Het aanpassen van het letterype (alleen Magmzaker Professional abonnement) wordt verderop op deze pagina uitgelegd.
     
  • Link: Selecteer een stukje tekst en kies het icon  uit de balk boven de tekst-editor. Het editscherm voor de link opent nu.
    Een externe link: plak de url waarnaar je wilt linken in het veld URL. Een externe link opent automatisch in een nieuw window.
    Je kunt er voor kiezen om automatisch een icon te laten plaatsen na een
    externe link  .
    Deze optie staat standaard uit. Kijk op de pagina Edities onder het kopje Instellingen hoe je dit aan kunt zetten 
    Een interne link: wil je een link maken naar een andere pagina in het magzine. Dan kun je de hele url in het veld plakken (door op de pagina op VOORBEELD te klikken kun je de url van een pagina uit de browser kopiëren) je kunt ook alleen het laatste deel van de url in het veld plakken /editienaam/paginanaam.
    Een interne link open automatisch in hetzelfde window. Wil je de link openen in een nieuw venster, klik dan in het editscherm van de link op Uitgebreid en vink onderaan Open in new window/tab aan.

     
  • Link opmaken: Een link krijgt op de pagina de kleur die staat ingesteld voor de algemene tekst. De link krijgt niet automatisch een andere kleur of onderlijning, deze kun je er zelf aan toekennen. In de tekst-editor is de link blauw dus je herkent hem eenvoudig. Selecteer de linktekst en kies onderlijnen uit de balk bovenin of ken er een een kleur of opmaakstijl aan toe uit de dropdown Stijl (dit zijn de Editor-stijlen; zie de paragraaf hieronder).
     
  • Stijl: De tekst of een deel van de tekst een kleur geven? Selecteer alle of een deel van de tekst en kies uit de dropdown Stijl een kleur of opmaakstijl zoals bijv Hoofdletters of textshadow. Je kunt meerdere stijlen aan een selectie toekennen, bijv, wit + hoofdletters + textshadow.
  • Iconen gebruiken: via het icon  kun je in je tekst iconen toevoegen.
    In het geopende editscherm type je in het veld Icon-Name-fa de naam een icon dat je zoekt. Bijv arrow, email, flag, search, LinkedIn etc. Je krijgt dan suggesties te zien. In de beschrijving boven het veld Icon-Name-fa staat een link naar de font-awesom icon lijst voor een overzicht en de namen van de iconen.
    Sommige icons hebben 2 varianten; een helemaal zwart  
    (regular). Standaard wordt het solid icon gebruikt. Wil je de regular variant, klik dan Additional Font Awesome Settings open en kies bij Stijl de opie Regular.
Een afbeelding in de tekst invoegen

Binnen een tekstblok kun je ook een afbeelding invoegen uit de media manager. Je kunt hiermee de tekst mooi om de foto heen laten lopen. 

  • Kies het icon  uit de balk boven de editor
  • De media manager wordt geopend. Je kunt nu de afbeeling uit de media manager kiezen of een nieuwe afbeelding uploaden
  • De gekozen afbeelding wordt in de teksteditor geplaatst om de afmeting en positie te bepalen klik je boven de afbeelding op Media bewerken

 

Tekstblok met afbeelding met tekstomloop

Tekstblok afbeelding invoegen

Media bewerken

  1. Tekstalternatief - hier staat het tekstalternatief dat je hebt ingevuld in de media manager
  2. Uitlijning - hier geef je aan waar de afbeelding moet worden gepositioneerd
    • Geen 
    • Links
    • Gecentreerd
    • Rechts
  3. Onderschrift - Aanvinken als je een onderschrift wilt toevoegen, de tekst voor het onderschrift kun je later onder de afbeelding toevoegen
  4. Weergeven - Hier kies je het formaat van de afbeelding.
    Default gebruikt de afmeting van de afbeelding
    Een van de andere opties snijdt de afbeelding in de gekozen verhouding; een staand, liggend of vierkante verhouding.
  5. Breedte - Standaard staat dit op 45%, dit kun je naar wens aanpassen. 
    Op mobiel (breekpunt 768 pixels) wordt de afbeelding automatisch 100% getoond.

Editor-stijlen

Editor-stijlen zijn opmaakstijlen (CSS) die bij de installatie van jouw Magzmaker magazine voor je ingesteld kunnen worden met bijv de kleuren van je huisstijl.
Gebruikers met een Professional abonnement kunnen zelf (CSS) stijlen (bij)maken of wijzigen. Gebruikers met een Publiser abonnement kunnen een verzoek doen om extra stijlen bij te laten maken als dat nodig is of omdat bijv. de huisstijl-kleuren wijzigen.

Stijlen maken of bewerken (Professional abonnement)
  Een stijl wordt gebruikt voor alle edities. Een stijl wijzigen wordt dus doorgevoerd in alle edites.

  • Ga naar het dashboard en kies Editor-stijlen uit het zijmenu
  • Je ziet het overzicht van de stijlen onder elkaar. De volgorde in deze lijst is de volgorde in de dropdown Stijl van de tekst-editor. je kunt de volgorde van de stijlen aanpassen door de stijl te verslepen. Pak de stijl op met   en sleep hem naar de gewenste positie. Klik onderaan op Opslaan om te bevestigen.
  • In het css definition veld kun je de stijlen wijzigen
  • De naam kun je wijzigen door op de naam klikken.
    Bedenk dat het wijzigen van de naam betekent dat de oude naam niet meer bestaat, tekst op bestaande pagina's die hiervan gebruikt maakt zal de opmaak van de stijl met de oude stijl naam verliezen
  • Een nieuwe stijl maken: Klik bovenin op Css item toevoegen
    Geef de stijl een titel (titel en classnaam hoeven niet gelijk te zien)
    Vul in het veld Css beschrijving de stijl in op deze manier:

    .classnaam{
      color: #ff0000;
    }

Fonts

Als er een eigen huisstijl-font is, dan is dit vaak met het aanmaken van de installatie al ingesteld. Gebruikers met een Professional abonnement kunnen een ander lettertype inschakelen of een eigen font uploaden.
Gebruikers met een Publisher abonnement kunnen een verzoek doen voor het aanpassen van het font, mocht bijv. het font van je huisstijl veranderen.

  • Ga naar het Mijn Magzmaker dashboard.
    Onder het menu onderdeel ADMIN zijn verschillende font opties mogelijk
    Fonts beheren: voor het instellen van de beschikbare Google-fonts in Magzmaker
    Custom fonts: Wanneer je een een eigen font hebt kun je hier de bestanden uploaden.
    Adobe font-script: een link naar een webproject dat is aan gemaakt in Adobe fonts
     
Google fonts
  • Kies Manage fonts: je ziet nu een overzicht van fonts met standaard ingesteld de selectie van Google fonts.
    De groen gekleurde fonts zijn ingeschakeld. Deze zijn beschikbaar om in te stellen in de Magazine- en Editie-instellingen. De overige beschikbare font zijn wit.
  • Nieuwe Google font toevoegen: scroll door het overzicht van fonts of type in het veld bovenin de naam in van een font dat je zoekt en klik op de paarse knop Toepassen. 
    Om het font beschikbaar te maken klik je op inschakelen onder het font, het font kleurt nu groen.
Manage fonts

 

  • Nieuwe font toepassen: klik op het font in het groene ingeschakelde font.
    Op de pagina die nu opent zie je de css van het ingeschakelde font.


    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;

    De naam die staat bij de font-family kun je kopieren (in dit voorbeeld Playfair Display) zonder de haakjes. Ga naar de Editie-instellingen van de editie waarvan je het font wilt aanpassen en plak Playfair Display in het veld van de kop die je wilt, bijv. de Kop H1.

    Editie-instellingen font Playfair  
  • Bij de Editie-instellingen (en de Magazine-instellingen) zie je onder de dropdown bij font-weight verschillende opties (o.a. normal, bold en verschillende getallen die een dikte aangeven). Het hang van het font af welke optie daarbij hoort, dit kun je ook zien in het stukje css dat je hebt geopend door op het groene ingeschakelde font te klikken (in dit voorbeeld 700).
  • Het font gebruiken in een Editor stijl: wil je een stijl maken in de Editor-stijlen met het nieuwe ingeschakelde font. Kopieer dan het hele stukje css dat je hebt geopend door op het groene ingeschakelde font te klikken.

    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;

    En maak hiermee een nieuwe stijl zoals hierboven beschreven
     
Editor stijl

Custom font
  • Hier kun je een eigen font uploaden. Het bestand moet een .woff bestand zijn. Woff is een font-extensie voor online gebruik.
    Na uploaden van je bestand kom je in een overzicht met custom fonts.
  • Klik op Inschakelen om het font te activeren.
  • Klik op View font om de css van het ingeschakelde font te zien.

    font-family: 'NaamFont';
    font-style: normal;
    font-weight: 700;


    Font toepassen: De naam die staat bij de font-family kun je kopieren (in dit voorbeeld NaamFont) zonder de haakjes. Ga naar de Editie-instellingen van de editie waarvan je het font wilt aanpassen en plak Playfair Display in het veld van de kop die je wilt, bijv. de Kop H1.

    Het font gebruiken in een Editor stijl: wil je een stijl maken in de Editor-stijlen met het nieuwe ingeschakelde font. Kopieer dan het hele stukje css dat je hebt geopend via
    View font.
Adobe font script

Wanneer je een Creative Clouds-abonnement hebt van Adobe kun je gebuik maken van Adobe fonts. Wanneer je het gewenste font en fontstijlen gekozen hebt kun je een webproject aanmaken, klik rechtsbovenaan de fontstijlen op </> toevoegen aan webproject en geef het project een naam. Er wordt dan een link aangemaakt die je in het magazine kunt zetten.
Bijv: <link rel="stylesheet" href="https://use.typekit.net/gis5cdw.css">
Lees meer over hoe je een webproject maakt op deze Adobe pagina.

Bij het toevoegen van een font aan een Adobe webproject wordt de css getoond die bij het font hoort. Dit is handig om te bewaren zodat je deze bij het instellen van het font in Magzmaker kunt gebruiken of als je tekststijlen in Magzmaker wilt maken. Bijv:

Sofia Pro Bold
font-family: "sofia-pro", sans-serif;
font-weight: 700;
font-style: normal;

Of open het Adobe webproject > klik op Project bewerken en bekijk de instellingen voor het font:

Adobe font script voorbeeld Sofia bold

  • Open in Magzmaker via het zijmenu Mijn magzmaker > ADMIN > Adobe font script. Plak in het veld Body de link die is aangemaakt in het webproject. Klik op opslaan.
     
  • Om het font toe te passen in een editie pas je de font-instellingen aan in de Editie-instellingen.
    En als je het font in alle volgende edities wilt gebruiken dan pas je het ook aan in de font-instellingen in de Magazine-instellingen (alleen voor Professional abonnement)
    Ga naar de Editie-instellingen via de paarse knop achter de editie in het editie-overzicht of via de paarse balk bovenin een pagina.

     
  • Gebruik in het veld voor het font de naam zoals die ook in het voorbeeld wordt gebruikt bij font-family, let ook op het gebruik van hoofdletters. In bovengenoemde voorbeeld css is dat sofia-pro.
    Om aan te geven of het gaat om light, regular of bold plaats je in het veld font-weight de waarde zoals in het stukje voorbeeld css. In het voorbeeld is dat
    700.
Editie-instellingen aanpassen met fontnaam uit Adobe font script