Logotyp vetenskapsrådet
logo_mobile

Pop up i Wordpress

Här hittar du manual för hur du hanterar och lägger upp en pop up i Wordpress

När du går in i funktionen pop up/VR modal på din webbplats finns en instruktion för hur du skapar, redigerar och tar bort en pop up.

Bild på pop up modal

Installation av pluginet

För att installera pluginet på din aktuella webbplats behöver du först klona ner repot och sedan skapa en zip-fil av det. Sedan går du till wp-admin-panelen och navigerar till ”Tillägg”. Klicka sedan på ”Lägg till nytt tillägg” och sedan på ”Ladda upp tillägg”.

Därefter kan du antingen dra och släppa den zip-filade mappen i uppladdningsfönstret eller välja filen genom att bläddra igenom katalogen. Pluginet kan sedan installerats på webbplatsen.

Installera plugin för pop up

När visas VR Modalen

VR Modalen visas när en besökare kommer in på webbplatsen. När VR Modalen har blivit visad så sätts en kaka (vr_modal_cookie) vilket gör att VR Modalen ej syns igen under samma session.

Om besökaren kryssar ner sin webbläsare och går in på webbsidan på nytt, så kommer VR Modalen att återigen synas.

Cookies för modal

Styra popupen med cookies

För att kunna styra popupen med cookies måste detta skript in i functions.php filen i ett wordpresstema.

/**
* Function to add cookie functionality to VR scripts.
*
* This function defines an array of scripts for VR, including their IDs, labels, keys,
* category, and status. The purpose is to extend the script blocker by adding VR scripts.
*
* @return array An array of scripts with their respective details.
*/
function scripts_list() {
$url = home_url( '/app/plugins/vr-modal/dist/index.js' );
$parsed_url = wp_parse_url( $url );
$site_url = $parsed_url['host'];

$scripts = array(
array(
'id' => 'vrmodal',
'label' => 'VR modal',
'key' => array( $site_url . '/app/plugins/vr-modal/dist/index.js' ),
'category' => 'funktionella',
'status' => 'yes',
),
);
return $scripts;
}
add_filter( 'cli_extend_script_blocker', 'scripts_list', 10, 1 );

OBS! 'category' => 'funktionella', Funktionella är själva kategorin som måste överensstämma med den satta kategorin i cookie pluginet, kan variera mellan svenska och engelska.

Speciella besöksparametrar i URL:en

Om en besökare kommer till webbplatsen genom att klicka på en länk i ett nyhetsbrev med parametrarna "?utm_source=Ungapped&utm_medium=email", kommer popupen att förbli dold under resten av besökssessionen för den specifika användaren.

Hur ändrar jag utseende på VR Modalen?

För att anpassa stilen för VR Modalen är det bäst att skapa egna CSS-klasser på den befintliga webbplatsen där VR Modalens utseende ska ändras. Grundstilen för VR Modalen ligger i Vue-appens dist-katalog, men genom att tillämpa anpassade CSS-klasser på webbplatsen kan du modifiera utseendet enligt önskemål.

Vill du se JSON datan?

För att få en överblick över den JSON data som finns på de VR Modaler som är ”Publicerad” så kan du skriva följande URL i webbläsarfönstret:
https://namn_på_webbsidan/wp-json/vr-modal/v1/modal-data.

JSON data