Drupal 3

In deze cursus werken een professioneel project uit en wordt de geziene leerstof ingeoefend. Ook wordt de leerstof nog verfijnd en aangevuld. Het is een e-learning cursus. Dat wil zeggen dat er slechts een beperkt aantal lessen wordt voorzien waarbij de cursist lijfelijk aanwezig moet zijn. De rest wordt via deze site aangeleerd. De didactische methode in dit deel is dan ook zeer uitgebreid omdat ze leerkracht vervangend moet zijn. Om deze reden wordt dit gedeelte dan ook voorbehouden aan de ingeschreven cursisten Drupal 3 bij PCVO Waas en Durme en is de inhoud paswoord beveiligd.

 

 

Views vervolmaking

In deze les gaan we views bespreken. We kennen reeds heel wat... maar toch. Wat wist je nog niet?

Een view gebruiken bij Node Reference

we gaan een puntenboekje maken met de punten van onze cursisten:

Het puntenboekje bevat een node reference naar de cursist. De titel wordt verborgen en automatisch gegenereerd met https://www.drupal.org/project/auto_entitylabel

Normaal gezien kan je nu een lijstje krijgen met de cursisten. Dit is standaard een oplijsting van de titels van de cursisten nodes. Ik heb er hun foto's bij gezet.

Je hebt namelijk bij de node reference een mogelijkheid om een view te gebruiken, waar je naar believen alle velden kunt gebruiken.

Je moet natuurlijk eerst de reference view maken.

Views Conditional

op https://www.drupal.org/project/views_conditional kan je een module vinden die een extra veld in een view maakt waarmee je inhoud kunt tonen afhankelijk van andere velden. Zo genereer ik de status afhankelijk van de percentages.

Het veld bevindt zich onderaan de lijst bij het toevoegen van velden. De rest is kinderspel. De wizard vraagt wat je wilt.

CSS en views

Bekijk eens onderstaande print. Er is op de afbeelding opmaak toegepast. De cursusnaam staat op 1.2em. Het percentage staat vet. De niet geslaagden staan rood en per cursus staat de rij anders gekleurd. Dit alles verwezenlijkt met de meest uiteenlopend methodes ... om didactische redenen.

Via de CSS injector heb ik deze classen aangemaakt. OK. Dit kunnen we al...

We beginnen met de makkelijkste methode. We zetten het percentage vet met behulp van de ingebouwde interface:

We kunnen ook gebruik maken van dezelfde tool om een classe te definiëren. (Cursusnaam op1.2em.)

Helemaal leuk wordt het als je ook via resultaten herschrijven, hetzelfde kunt. (afbeelding cursist opmaken.)

Via de Views Conditional (zie boven) kan je ook opmaak meegeven. Dit zet de de tekst 'niet geslaagd' in het rood.

Moeilijker wordt het als je de rij in zijn geheel wil CSS meegeven, afhankelijk van een waarde van een veld. Op Google kan je daaromtrent niet direct simpele antwoorden vinden en ik ben nogal simpel...

Ik heb het als volgt opgelost... Je kunt in de rijklasse een token gebruiken. Als je nu een klasse aanmaakt met dezelfde naam, dan kan je die aanspreken. Hier zal ik per cursus (Drupal 1, 2 of 3) een andere rijkleur genereren. Alleen het werkte niet omdat in mijn thema ook nog een td tag (table division of kolom) een kleur (wit) meekreeg. Mijn systeem werkte, maar werd onmiddellijk overruled door de td CSS. Vandaar dat je in de CSS ziet dat ik de td op transparent heb moeten zetten. Ik denk dat dit afhankelijk is van het gebruikte thema.

EVA: Entity Views Attachment

We hebben in het verleden al veel relaties gelegd tussen een inhoudstype en een view. Een voorbeeld is de schilder met daaronder de view van al zijn schilderijen. We losten dit op door de view te maken van alle schilders en een contextuele filter te zetten op de naam van de schilder. Vervolgens maakten we een viewfield aan in het inshoudstype en koppelden we dit met een argument. Wel er is eigenlijk een simpeler manier. EVA

De cursist heeft haar view met de resultaten. Hoe doen we dit nu?

Installeer de module en maak dan een view van dit type. Er zal gevraagd worden met welk type entiteit (vb node) en welke bundel (inhoudstype) je wilt koppelen.

 

Leg ook weer een contextuele filter:

Als je nu naar je inhoudstype gaat kijken, dan zie je dat in de weergave (enkel in de weergave!!) er een veld is met de view. Dit is het grote verschil met de eerste methode (viewfield). Het komt niet meer voor in het input formulier. Er is ook minder in te stellen, vind ik. Een ander groot voordeel is dat de speciale tekens mooi worden meegenomen in de contextuele filter. Zo kan je Marianne O'Tool (merk het accentje op) zonder probleem gebruiken. Bij viewfield met zijn argrumenten is dit pijnlijk moeilijk...

Views wiskundige expressie

zit standaard bij views. Kijk bij de velden naar wiskundige expressie. ik heb een veld toegevoegd 'eindwerk' en de inhoud aangepast. Nu komt het er neer dat ik de punten en het eindwerk optel en deel door 2 om het gemiddelde te berekenen.

Je kunt de precisie instellen na de komma:

 

Better Exposed Filters

zoals de titel zegt... Het is beter. Mogelijkheid om inklapbare filters te zetten, met wat uitleg en met selectievinkjes.

De gewone filters.. Je moet met de ctrl toets ingedrukt meervoudig selecteren.

De nieuwe versie. Een compacte filter.

die bij klikken..

Je vindt het bij de geavanceerde instellingen. Zichtbaar formulier...

Van dan af kan je de instellingen doen.

In combinatie met Views Table Filter kan je dit in een tabel in de kop zetten. De ineengevouwen versie werkte bij mij niet. De uitgeklapte versie wel.

Je moet enkel bij de BEF instellingen dit aanzetten:

Views fieldset style plugin

op https://www.drupal.org/project/views_fieldset vind je een simpele module die de inhoud van een view wat compacter maakt.

Je kiest in plaats van HTML of velden voor veldgroep en stelt je voorkeur in. Met het herschrijven van de resutlaten kan je het titelveld wat meer betekenis geven.

Views PHP

Integreert PHP in views. Je kunt daarmee een php veld maken. We gaan dit toepassen om de graden toe te kennen volgens het percentage.

Belangrijk! Gebruik de https://ftp.drupal.org/files/projects/views_php-7.x-2.x-dev.zip versie. In de gewone versie zitten er een bug die met een patch moet rechtgezet worden. In de dev versie is dit reeds opgelost.

Dit is de php. Bekijk het aandachtig. Het maakt gebruik van de switch code. Echo is het trefwoord om iets kenbaar te maken.

<?php

switch (true) {
    case ($row->field_punten>=85):
        echo "grootste onderscheiding";
        break;
   case ($row->field_punten>=80):
        echo "grote onderscheiding";
        break;
    case ($row->field_punten>=70):
        echo "onderscheiding";
        break;
    case ($row->field_punten>=50):
        echo "voldoening";
        break;
  case ($row->field_punten<50):
        echo "niet geslaagd";
        break;
    }
?>

Je stelt het veld in. Zet het onder de anderen om ook tokens te kunnen gebruiken van de bovenstaande velden.

Zet de code in het output veld.

Views Field View

Op https://www.drupal.org/project/views_field_view kan je de module vinden. Ze biedt je de mogelijkheid om in een view een andere view als veld binnen te halen. Vb een overzicht van acteurs met per rij hun films. Wij gaan het met ons puntenboekje doen... We gaan per resultaat ook achteraan het gemiddelde van de cursus tonen. Drupal 1 heeft blijkbaar 77% als gemiddelde.

We maken eerst de view die dit gemiddelde berekent. Vergeet ook niet een contextuele filter op de cursusnaam te zetten. Anders krijg je van elke cursus de gemiddelden onder elkaar.

Nu gaan we in onze view van het puntenboekje het veld toevoegen:

Met de volgende logische instellingen. Ook hier geef we weer naar welke contextuele filter er moet gekeken worden.

Views Infinite Scroll

op https://www.drupal.org/project/views_infinite_scroll zie je de module en ook een paar voorbeeldsites. Het komt er op neer dat men geen paginering gebruikt, maar als je telkens het eind van de pagina bereikt vult de view zijn inhoud aan. Handig als je een grote view hebt. Je hebt het trouwens al eens meegemaakt bij sites zoals Pinterest enz..

We maken eerst een 50 tal nodes aan. We gaan daarvoor nu een de devel module gebruiken. Een plezier om nep nodes mee te maken.. https://www.drupal.org/project/devel  Gebruik enkel de Devel Generate. De rest is om Drupal te ontwikkelen.

Eerst een inhoudstype:

Nu het wonder. Je kiest het inhoudstype en stel de voorkeur in.

Yep. Een node aangemaakt. Het mens moet nog geboren worden... Wat Drupal al niet kan hé. Als afbeelding krijg je van die steriele foto's. Enfin we hebben 50 nodes.

Bij de paginering zet je infinite scroll.

Als je nu vlug genoeg naar onder scrolt, dan zie de drie blokjes die de inhoud aan het binnenhalen zijn.

Zo.. ik heb nu met je enkele zaken besproken die in de voorgaande Drupal cursussen nog niet aan bod waren gekomen. Is er nog ?... wat denk je...

Navigatie

We behandelen volgende (simpele) modules:

link module

ingebouwd in de core. Dient om een URL in te vullen. Weet dat je ook makkelijk een link kunt leggen op tekst en een afbeelding via de CKEditor. Hier hebben we een apart veld.

linkit

zorgt voor een mogelijkheid om interne links op te zoeken.

image link formatter

Zorgt dat je op een afbeelding een link kunt leggen met behulp van een ander veld:

Image hotspots

Je kunt met deze module op een afbeelding, gebieden instellen als link, met tooltip. Mer ok dat onderstaande print één afbeelding is.

Hier zie je de instellingen bij een afbeeldingsveld.

Je kunt bij de verfijning van het veld in je inhoudstype kiezen dat je hotsopts gaat gebruiken.

 

glossify

Een module die er voor zorgt dat bij bij het invullen van een titel in een node er automatisch een link komt naar die inhoud.

Je kunt ook een tooltip insstellen.

Je bepaalt zelf welke inhoudstypes er moeten doorzocht worden.

text or node link

Als je een tekstveld aanmaakt kan je als widget text of node kiezen. Vul je iets in dat als titel voorkomt in een inhoudstype dan wordt dit een link. Anders blijft het gewoon een stukje tekst. Bij gewone node reference moet er altijd een bestaande node bestaan. hier niet.

Daarvoor moet je bij de weergave dit kiezen.

bij de input:

Je stelt ook in voor welk inhoudstype je de referentie wilt.

link click count

Zorgt er voor dat je ziet hoeveel keer er op een link werd geklikt. Handig voor sponsors..

Je stelt het formaat in bij het veld.

 

colorbox node

Een link omzetten naar een colorbox presentatie, ongeacht de inhoud... Knap

Het geheim zit hem in de class die je toekent. In de broncode zet je dit er bij. Optioneel kan je er ook de hoogte en breedte mee instellen.

Het reultaat...

 

linkchecker

Kijkt of er in de tekst geen links voorkomen die niet meer werken. Als admin krijg je bij bewerken dan een melding.

external links

zorgt voor een icoontje als je een externer link hebt. Ook een mail link wordt met een speciaal symbool weergegeven.

De instellingen:

pathologic

Een speciale module.... Je activeer het en hij zorgt dat bvb bij RSS Feeds van je site de links absoluut worden. Dit is nodig want de abonnee op je Feeds zal anders een foute link krijgen. Naar het schijnt zet hij ook de links goed als je van sitenaam wijzigt..

menu attributes

Een menu is ook een link natuurlijk. Met menu attributes kan je zowel een CSS klasse als een doelvenster instellen.

Veldinhoud beheren

In deze les gaan we technieken leren om inhoud in een veld op automatische wijze toe te kennen. Feeds en Editable views kunnen ook inhoud input aan, maar deze modules hebben we reeds gezien.

Onderstaande print heeft zowat alles in huis om een overzicht te krijgen van de mogelijkheden. Het gaat over een inschrijving voor een BBQ...

1) Automatische node titel

Via Auto Node Title wordt de titel automatisch gegenereerd op basis van drie andere velden: Naam, aantal volwassenen en aantal kinderen. De titel wordt zelfs als veld verborgen voor de input. In het webshop gedeelte zullen we daar later ook gebruik van maken om producten automatisch bvb de kleur en maat mee te geven. vb Tshirt (blauw, XL)

met als resultaat...

2) Serial field

Het inschrijvingsnummer wordt automatisch gemaakt door een autonummeringsveldje.

Dit gebeurt door de module Serial Field. Ideaal om bvb factuurnummers te genereren.

3) Views Bulk operations (VBO)

Met deze module kan je in een view een selectieblokje creëren voor elke node in de tabel. Daarmee selcteer je de nodes die je wilt bewerken. Dit gaat van verwijderen, depubliceren,.. tot en met de inhoud wijzigen. Wij focussen ons op dit laatste.

Om dit te bekomen voeg je eerst het veld in:

Daarna verfijn je.

Een waarde instellen voor de geselecteerde nodes kan als volgt: (je kunt ook alle nodes selecteren)

 

Je kunt ook via search and replace in een tekstveld woorden vervangen

het resultaat...

4) Standaard waarden

Eén van de meest gekende manieren om inhoud aan een veld toe te kennen is een standaardwaarde instellen. Er zijn 2 modules die een uitbreiding zijn van deze standaard werkwijze. Default token zorgt er voor dat je dynamisch kunt werken door de inhoud vna andere velden te bebruiken via tokens. Field Defaults wordt gebruikt om de standaardwaarde te wijzigen en in te stellen. Tot daar geen probleem, maar wat doe je met nodes die reeds bestaan. Standaardwaarden worden maar ingevuld bij het aanmaken van nieuwe inhoud. Met deze module kan je met terugwerkende kracht op bestaande nodes de velden een standaadwaarde geven. Merk bij onderstaande print de mogelijkheden op.

5) Computed fields (berekende velden)

Deze module is tot heel wat in staat.

We berekenen eerst het toaal aantal personen die per inschrijving komt.. 2 + 4 = 6..

De instellingen van dit veld vergen een woordje uitleg...De display code toont dat $entity_field_item['value'] de variabele is waar we mee moeten werken. Het voorbeeld spreekt boekdelen. Kijk hoe je naar een veldwaarde verwijst. Je voegt zelf zoveel variabelen toa als je wilt. Tel ze op en ken ze toe aan de $entity_field_item['value'] Klaar. Vergeet nooit een $ teken te plaatsen voor een variabele. PHP werkt zo...

Computed field tools is een module die met terugwerkende kracht alle nodes waar het veld in voorkomt herberekent. Bij structuur is er een optie bijgekomen.

Als tweede oefening berekenen we het totaal bedrag. Je ziet dat we de kinderen aan de helft van de prijs rekenen.

Als derde oefening van berekende velden gaan we zelf HTML schrijven, afhankelijk van een waarde  in een ander veld. Als er korting is van 20 € (veld korting bevat dan 20), dan gaan we een leuke kortingsfiguur tonen, anders tonen we niets...Eerst halen we het veld op. Dan controleren we met de PHP if functie of het 20 is. Bekijk aandachtig de syntax om te vergelijken. Vergeet geen 2X een gelijkheidsteken te zetten. De strings worden in PHP door een punt aan elkaar gekoppeld. Onze figuur heeft als naam korting20.jpg zaols je kunt zien. Deze methode kan dus gebruikt worden om getallen en waarden om te zetten naar figuren. In views konden we ook dit al met herschrijven...

Als vierde oefening gaan we de eigen node overstijgen en zien we dat we met Computed Fields ook de Drupal database kunnen aanspreken.. Hou je vast aan de takken van de bomen.. We gaan het toaal aantal ingeschreven personen berekenen. Daarvoor gaan we eerst via het control panel in de database om de namen te bekijken van de tabellen en velden die we nodig hebben. Met 'foreach' doorlopen we alle records van deze tabellen en tellen zo het aantal volwassenen en daarna het aantal kinderen op. We vullen telkens onze uiteindelijke Computed Field variabelen met deze waarden. Als je ooit veel inschrijvingen hebt moet je de 0, 10 optrekken natuurlijk. Dit is het begin en aantal records die je wilt tellen.

Uit een andere oefening heb ik dit gehaald. Het maakt gebruik van de PHP switch functie. Bekijk maar eens hoe logisch die is opgebouwd..

6) PHP veld

Een teskveld (body) kan je met de CKeditor omzetten naar een PHP veld als deze module (van de kern) werd aangevinkt. PHP kan verbinding maken met de database van Drupal en zelfs met andere databases. Wij houden het bij deze eerste en gaan opverkenning via het Control Panel van de hosting. We verkennen in de dabase een table met naam 'node'. We zien de node titels staan in het veld 'title' en het inhoudstype heeft blijkbaar de naam 'type'.

We willen nu een veld met de naam 'alle inschijvingen' toevoegen aan ons inschrijvings resultaat. Ik weet wel je kunt dit ook met een view, maar dit is plezanter..

Hoe ga je te werk... Eerst vul je de connectiewaarden in. Natuurlijk moet je de paswoorden kennen van je database. Daarna ga je naar een tabel en je haalt er de records uit. Hier filteren we op het type= inschrijvingen. anders hebben we alle titels uit onze Drupal. Met een tellertje houden we nog het aantal bij.. 'echo' is de PHP syntax om iets op het scherm te laten verschijnen.

Als je nu iemand laat isnchrijven, dan ziet die gans deze php code. Zeker niet ideaal... met de paswoorden.. Field extra widgets laat je toe om een veld verborgen te zetten. Let wel het is dan ook voor jou verborgen. Je kunt het echter terug normaal zetten om aan te werken..Als het niet openstaat voor de anonieme gebruikers kan je gerust PHP gebruiken. De bezoeker ziet enkel het resulaat. Ook niet met een inspector.. PHP wordt op de server uitgevoerd.

 

7) Rules

Alhoewel dit nog als een afzonderlijk les wordt behandeld, geef ik toch al een kleine voorzet.. Als je meer dan drie kinderen hebt krijg je 20 € korting..

We maken een nieuwe regel aan. We gaan eerst de gebeurtenissen bepalen waarvoor de rule geldt. Als we nieuwe inschrijvingen hebben of bestaande wijzigen willen we dat er gerekend wordt.

Daarna gaan we de voorwaarde instellen. We kiezen voor data vergelijking.

met deze instellingen. Je kiest het veld, de operator en daarna de waarde.

Nu gaan we bepalen welke acties er worden ondernomen. We kiezen om een waarde in te stellen en een berichtje op het scherm te laten verschijnen van de korting. Je kutn er evengoed een mail mee versturen naar de persoon (als er een mail veld zou zijn).

De waarde wordt zo ingesteld

En het berichtje:

Het veld wordt ingevuld en ja hoor..

Algemene herhaling

Deze cursus Drupal3/Webshop bevat zoals de naam reeds doet vermoeden uit 2 delen. Eerst heb je een algemeen gedeelte dat de modules bespreekt die in een Webshop ten volle gebruikt worden, maar die ook algemeen bruikbaar zijn. Bvb Rules

In deze les wordt eerst de hosting besproken. De cursisten gaan hun site wat personaliseren. Thema isntalleren, wat opmaak,...

Image effects

Op het net zijn er talrijke voorbeelden beschikbaar van effecten toegepast op afbeeldingen, menus, ....  Op http://tympanus.net/Tutorials/OriginalHoverEffects/index.html kan je daar enkele voorbeelden van zien. Surf maar eens op hun site om andere effecten te ontdekken. Het is belangrijk om te controleren dat de effecten multibrowser zijn. Zeker in combinatie met javascript is dit niet altijd zo.

De image effecten beginnen sterk aan belang te winnen, omdat ze een mooie presentatie geven van afbeeldingen. Webshops maken er ook meer en meer gebruik van. De manier om dit te implementeren is nagenoeg dezelfde voor elk effect. Vandaar dat ik met één uitgewerkt voorbeeld een gans gamma voor je open. Ik merk wel op dat dit een niveau 5 is qua moeilijkheid.

We gaan een foto overzicht maken met een view:

die per foto een effect vertoont. Je ziet bij hoveren de titel, een stukje uit de body en een knop om naar de inhoud te gaan.

Live Demo

Je kunt op hun site ook een demo zien en de bijhorende code met bestanden downloaden. Waarvoor dank.

Als je nu op een indexpagina klikt zie je lokaal al dat het werkt. Test dit uit. Hoe ga je dit nu online zetten?

1e methode: het klakkeloos overnemen van de code

Daarvoor zouden we moeten we de mappen uploaden naar onze sitesmap. We maken dan een basic page pagina aan, waar we php als tekstmodus nemen. Deze mogelijkheid moet eerst als kernmodule geactiveerd worden.

Daarna moet je alle links in je pagina naar de betrokken mappen verleggen. Ik heb dit bvb uitgewerkt voor een soort 3D effect (jammer genoeg niet goed werkzaam in IE): http://drupalsnelcursus.be/demo/javascript/3D

Je begrijpt echter dat dit er hier geen integratie is in Drupal. Er zijn geen velden, geen inhoudtypes,...Stel je voor dat je bvb een webshop hebt, waar je voor elk artikel een nieuwe pagina zou moeten maken...

2e methode: integratie in Drupal

We maken een inhoudstype aan met een zestal nodes, telkens met een foto. Je kunt gebruik maken van de images die meegeleverd werden uit de download. Daarna gaan we een view maken om deze foto's te tonen.

De lees meer tekst heb ik vervangen door een afbeelding met een link. ik heb een figuurtje vna het net gehaald.

<img alt="" src="/demo/sites/default/files/more_icon.png" style="left:45%;height:34px; width:34px" />

Je krijgt dit voorbeeld als resultaat:

We kopiëren nu de CSS (hier is er geen javascript) naar de CSS injector en passen dit toe op onze view. Ik heb hier en daar al iets gewijzigd omdat ik het mooier vond... De CSS die ik gebruik staat hier onder.

.links_uitlijnen{
display:block;
float:left;
}

.view {
    /*width: 300px;*/
    height: 200px;
    /*margin: 10px;*/
    margin: 10px 5px 10px 5px;
    float: left;
    /*border: 10px solid #fff;*/
    /*overflow: hidden;*/
    position: relative;
    text-align: center;
    /*box-shadow: 1px 1px 2px #e6e6e6;*/
    cursor: default;
    /*background: #fff url(../images/bgimg.jpg) no-repeat center center*/
}
.view .mask, .view .content {
    width: 300px;
    height: 200px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0
}
.view img {
    display: block;
    position: relative
}
.view h2 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 17px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0
}
.view p {
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 12px;
    position: relative;
    color: #fff;
    padding: 10px 20px 20px;
    text-align: center
}
.view a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    box-shadow: 0 0 1px #000
}
.view a.info:hover {
    box-shadow: 0 0 5px #000
}

.view-first img {
    transition: all 0.2s linear;
}
.view-first .mask {
    opacity: 0;
    background-color: rgba(219,127,8, 0.7);
    transition: all 0.4s ease-in-out;
}
.view-first h2 {
    transform: translateY(-100px);
    opacity: 0;
    transition: all 0.2s ease-in-out;
}
.view-first p {
    transform: translateY(100px);
    opacity: 0;
    transition: all 0.2s linear;
}
.view-first a.info{
    opacity: 0;
    transition: all 0.2s ease-in-out;
}

.view-first:hover img {
    transform: scale(1.1);
}
.view-first:hover .mask {
    opacity: 1;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
    opacity: 1;
    transform: translateY(0px);
}
.view-first:hover p {
    transition-delay: 0.1s;
}
.view-first:hover a.info {
    transition-delay: 0.2s;
}
.site-footer{
display:none;
}

Je zult zien dat er nog niet gebeurt. Logisch de CSS is wel al aanwezig, maar de classes zijn nog niet toegekend.

Om te zien wat er aan wat meot gekoppeld worden kijken we aandachtig naar de code die in de index.html pagina wordt getoond:

We zien dat er een class view en view-first rond elke figuur staat en dat de tekst de klasse mask toegekend krijgt. OK. Hoe pas je dit nu toe op je Drupal view? Wel omdat je in een view de inhoud kunt herschrijven, kom je in een codeveld terecht, waar je gelukkig ook nog de tokens kunt gebruiken. Herschrijf het laatste veld. Je kunt niet herschrijven met een veld dat lager staat. Vergelijk eens onderstaande print met bovenstaande print. Zie je hoe ik de structuur behoud?

Tenslotte moeten we ook nog bij de instellingen van de onopgemaakte lijst, de klasse toekennen. Blijkbaar is de container (waar de figuren in zitten) ook van belang.

Views bieden dus de mogelijkheid om door te herschrijven een combinatie te maken van Drupal, met zijn flexibele instellingen, en de stugge HTMLcodes die verwijzen naar de classes.

Om hetzelfde bij nodes te doen is andere koek. Bij nodes kan je wel classes toekennen bij de weergave met de field formatter class module. Zeker het proberen waard, maar dit laat ik het aan jullie over...Ik vrees dat geneste divs niet echt tot de Drupal flexibiliteit horen.

Oefening:

ga naar http://css3.bradshawenterprises.com/flip/

en maak dat er bij het hoveren een andere foto verschijnt. Deze overgang gaat via een mooi transform effect. Je ziet de foto draaien. Deze toepassing kan gebruikt worden in webshops waar je vóór- en achterkant van kleding kunt tonen. Je kunt ook tekst laten verschijnen ipv een foto.

 

Distributies maken

Een distributie maken is makkelijker dan je denkt.

Je maakt eerst een site met alles wat je nodig hebt. Deze site sla je op, op je computer. Je doet de settings.php file weg. Als je dit doet online, zal Drupal trouwens een nieuwe installatie beginnen..Default.settings moet wel blijven staan.

De map sites bevat dus alle modules, thema's, libraries,.. die je wenst voor je distributie.

de modules..

de Third Party..

de thema's..

de vertalingen...die zijn er automatisch gekomen als je een vertaling installeert via i10update...

Als je nu naar de map profiles gaat. (een root map) Dan zie je normaal 3 profielen. minimal, standaard en testing. Testing is zonder activering niet zichtbaar voor de leek...De twee andere profielen zie je bij de installatie. Minimal heeft bvb geen inhoudstypes 'basic page' en 'article'.

Ik heb de map standard gekopieerd en de naam distributie gegeven. Op deze kopie werk ik nu mijn distributie verder uit.

Het is interessant om bvb de map standard eens te bekijken. Het bevat een map translations om reeds tijdens de installatie vertalingen te kunnen uitvoeren. Alle vertaalbestanden die je daar naar toe kopieert, zorgen dus voor een onmiddellijke vertaling tijdens het installatieproces.

Standard.profile maakt dat je de modules die zich in de map sites bevinden ook reeds kunt activeren. Pas het bestand aan. En zet de gewenste modules actief. Je hoeft niet alles actief te zetten. Sommige modules moet je aan de kueze van de gebruiker overlaten.

Onderaan kan je ook gegevens naar je hand zetten.

Het andere bestand..standard.install zorgt voor de php code voor de inhoudstypes. Als je dit zou willen kan je daar mee experimenteren om zo zelf nieuwe inhoudstypes te maken. Ik gebruik echter het alternatief. Ik heb met features een module gemaakt die de gewenste inhoudstypes aanmaakt. Ik moet dus gewoon deze module activeren en op zijn beurt doet het ding zijn werk. Simpeler kan niet hé.

zo ziet de distributie er uit. Merk de drie profielen op.

ik heb in de map translations (submap van de profilemap) ook vertalingen gestoken, die van de core incluis.. Vandaar dat er reeds in de tweede stap naar een taalkeuze gevraagd wordt.

en nu ben je vertrokken...

Ik heb een distributie met een vijftigtal modules. Samen met hun vertalingen belasten ze de server tamelijk. Zwakke hostings durven daar op een whitescreen botsen...

Pagina's