Individuell Inlämningsuppgift
Wordpress/Woocommerce
- Val av tema. Vad har du för tema på din webbplats och vad behöver normalt sett övervägas vid val av tema? Utveckla varför du valt ditt tema om du inte gått på rekommenderat tema.
Det är viktigt att kontrollera att temat är kompatibelt med just sin wordpress version. Även att temat passar för de behov man har och det man tänkt använda webbplatsen till. Att det har goda recensioner och många användare är ett gott tecken samt att det uppdaterats regelbundet. Sen är såklart budget en viktig parameter, då det finns både gratis teman samt betalda varianter.
- Installation av Google Tag Manager och Google Analytics. Hur har du gått tillväga vid installation av Google Analytics? Fungerar mätningen som det skall? (visa gärna med skärmdumpar)
Vi börjar med att skapa ett nytt konto, både i GTM och Google Analytics. När vi skapat ett konto i GTM får vi en kod, alltså ett GTM-ID som vi måste få in på vår wordpress sida. Detta gör vi med hjälp av tillägget GTM4WP, där vi klistrar in denna kod.Efter att detta är gjort skapar vi ett nytt Google Analytics konto, med en ny property som då ska vara kopplat till den domän vi vill spåra. Här görs lite olika inställningar och vi svarar på frågor såsom hur stort företaget är, vilken bransch det handlar om etc. och vad vi i huvudsak vill få ut av vår hemsida. Tex “drive online sales”, “generate leads”. Vi väljer det som passar bäst, då detta påverkar lite hur vi ser rapporterna sedan i Analytics. Sedan skapar vi en stream – som alltså är våran URL samt att det är via Webb som vi vill spåra. När vi klickat på denna så får vi ett measurement ID. Detta measurement ID använder vi när vi sen skapar en ny tagg, triggers osv i GTM.
- Målmätning enligt digital mätplan
I kursen Digital Marknadsföring skapade du en digital mätplan. Är den mätplanen fortfarande aktuell, eller är det något som tillkommit/fallit ifrån? Använd dig av mätplanen som grund och se till att få dina målmätningar på plats. Jag vill här se att du mäter och följer upp de KPI:er som du tänkt dig, plus att mätningen fungerar.
Jag bifogar min digitala mätplan som gjordes i förra kursen. Eftersom jag har en ren e-handel så är mina viktigaste KPIer kring försäljning. Jag tycker att min mätplan fortfarande är aktuell, och att jag följer den. Några få justeringar blir det då våra företag ju är fiktiva. Tex. så har jag inga aktiva sociala media konton för detta projekt, eftersom att denna uppgift i huvudsak innebär att arbeta med en hemsida.
Allt rörande köp kan jag dock spåra i Google Analytics. Jag kan även få prenumeranter på nyhetsbrev.
- Uppföljning kring e-handelsspårning
Visa att det går att köpa och att e-handel spårningen fungerar.
Här nedan visar skärmdumpar att köp går att utföra samt att det även spåras i Google analytics.
- Hur har du utformat webbplatsens startsida och varför?
Mina färgval är genomgående jordnära och naturliga då detta passar till företaget. I övrigt en tydlig struktur, det ska vara lätt att hitta på min startsida. Tanken är att branda företaget och visa upp produkterna på ett snyggt sätt. Jag har lyft fram ett par stycken kampanjer men också andra uppmaningar som tex att “spana in vår nya kollektion här!”. En bildkarusell för att snabbt, enkelt och snyggt se ett urval av produkter.
- Utvalda produkter (bästsäljare eller kanske de med bäst marginal) skall lyftas fram på startsidan. Där bör även finnas usp:ar och en säljande beskrivning av företaget/verksamheten. Hur har du resonerat här?
Jag uppmanar kunderna att “spana in vår nya kollektion!” med en länkad bild till denna. En kort säljande text om vad vi gör, och vad man får hos detta företag. Jag har även lagt en större annons angående påskkampanj samt en rabattkod för detta! Samt bilder och några kortare om våra huvudprodukter.
- Hur har du lagt upp webbplatsens meny, struktur och navigering? Beskriv hur du lagt upp dessa delar. Följer det hela en logisk struktur?
Jag tycker att jag har en mycket bra, lätt och tydlig menystruktur. Jag hade skissen från förra kursen, sidstrukturen i huvudet dock har det tillkommit ytterligare produkter och kategorier sen dess. Man hittar lätt det man söker redan i headern. Både själva produkterna samt köpvillkor etc. Inget konstigt eller oväntat, utan så som besökare är vana att se från andra hemsidor.
- Det skall finnas statiska undersidor som tydligt beskriver ”Om oss”, ”Kontakt”, plus de leveransvillkor och köpvillkor som gäller. Även frakt och returer bör beröras i samband med detta. Beskriv här även varför du valt just de villkor som du valt.
Detta finns. Jag valde i det här fallet att ta en fri mall, som innehåller allmänna svenska köpvillkor gällande E-handel. Denna fann jag på https://www.nordiskehandel.se/ https://www.nordiskehandel.se/forslag-pa-kopvillkor
- Vilka kontaktformulär har du på webbplatsen och vad har de för syften? Det skall finnas minst ett kontaktformulär på webbplatsen.
Under “kontakta oss” i huvudmenyn kommer man till ett kontaktformulär som är integrerat med min mail som är knutet till detta wordpress-konto. Detta är inlagt med shortcode.
- I vilket sammanhang har du använt dig av shortcodes? Det skall finnas minst ett användande av shortcode på webbplatsen.
Som ovan nämnt så är kontaktformuläret inlagt med shortcode.
- Hur har du utformat Webbplatsens footer och varför?
Footern i mitt fall skall inspirera till att följa oss (via sociala medier knappar), att prenumerera på vårt nyhetsbrev men också att lyfta fram fördelar såsom fri frakt & retur, snabba leveranser, 30 dagars öppet köp. Kunden ska även lätt kunna ta kontakt, samt se kontaktuppgifter.
- Vilka åtgärder har du vidtagit för att det tydligt skall framkomma att det är en demobutik och att det faktiskt inte går att handla ”på riktigt”?
Det dyker upp en banner som man manuellt måste avfärda, annars syns den hela tiden med texten “Detta är demobutik för teständamål – inga beställningar kommer att behandlas!”
- I vilken utsträckning och hur har du arbetat med WooCommerce på webbplatsen? Det skall finnas produkter i någon form att köpa på webbplatsen. Produkterna skall vara minst tio till antalet och antalet kategorier minst tre. Beskriv vad du gjort och hur du gått tillväga. Undantag till detta kan finnas om det främst är tjänster som erbjuds, stäm av med Daniel om så är fallet.
Jag har arbetat med Woocommerse i stor utsträckning, det är ett mycket användbart och bra verktyg. På min sida finns det 3 huvudkategorier och totalt 18 olika produkter.
- Vilka produkttyper har du arbetat med och varför? Här handlar det alltså om enkel/grupperad/variabel/nedladdningsbar/etc. Visa på exempel.
Jag har främst arbetat med enkla produkter då mina valda produkter är tillverkade i en storlek, design och inte har något behov av att vara variabla. Jag har heller ingen form av nedladdningsbara produkter i det här fallet. Jag väljer dock att göra ett par variabla produkter, för att lära mig även det. Detta gör jag i form av storlek/ml på termosmuggar. Se bild nedan.
- Hur har du sökmotoroptimerat din webbplats? Vilka åtgärder har du vidtagit och vad har du fått för resultat? Knyt också gärna an till den sökordsanalys som du gjorde i kursen Digital Marknadsföring.
Tillägget YOAST är aktiverat, och något jag jobbat med en del. Det hjälper till att påminna om förbättringar och visa på brister. Jag har jobbat med att ange fokusnyckelsökordsfras för varje produkt samt en bra, lagom lång och relevant meta description. Därtill har jag lagt in en FAQ där jag fått in sökorden lite extra på ett bra sätt.
- Visa på exempel från Google Search Console på sökfraser som du tagit position och eventuellt även drivit trafik på.
Infogar en bild på de sökord jag drivit trafik på samt tagit position på. Jag har senare under uppgiftens gång även lagt till en FAQ sida, där jag kommer inkludera mina sökord och hoppas på att detta kan hjälpa till i arbetet.
- Hur många indexerade sidor har din webbplats och hur väl stämmer det överens med antalet publicerade? Vad beror eventuell skillnad på?
Jag har i skrivande stund 31 stycken indexerade sidor, detta har ökat rejält från tidigare då det låg runt 10 st. Det ändras och uppdateras ju kontinuerligt. Majoriteten av sidor som ej indexerats har texten “upptäckt – inte indexerad för närvarande” så det verkar vara främsta orsaken till varför de inte indexerats ännu. Jag har själv begärt indexering av vissa sidor.
- För att undvika att borttagna sidor indexeras felaktigt, så bör webbplatsägare arbeta med så kallade redirects. Visa på ett par sidor där du gjort detta genom att länka till dessa.
- Denna sida var en sida som hette “butik” som jag inte ville ha. Den är nu omdirigerad till min “shoppa” sida. https://past.webmastern.nu/?page_id=47&preview=true
- Även detta, som var en exempelsida från Elementor, ville jag ej ha kvar. Valde att omdirigera den till min startsida: https://past.webmastern.nu/exempelsida/
Även denna uppgift sida är skapad med en sådan omdirigering.
- Det skall gå att prenumerera på nyhetsbrev, alternativt att anmäla sig till kundklubb. Även i dessa fall är spårning i Google Analytics att rekommendera, men inget måste.
Det går att prenumerera på nyhetsbrev. En koppling är också gjord mellan Google Analytics samt Mailchimp. Detta gör att alla kampanjmail går att spåra.
- Skapa en kampanjsida med Påsk-erbjudande. Denna kampanjsida skall vara skapat med hjälp av Elementor och innehålla följande delar:
- En textruta med bakgrundsfärg
- Produktbild och text
- Länk till produkten
- Produkten ska ha ett nedsatt pris till 2024-04-01
Beskriv ditt resonemang kring sidan och länka till den i ditt svar.
Utöver ovanstående, så valde jag att testa på en annan variant som kan synas på min startsida, där är en påskkampanj som är giltlig till ett visst datum med en kampanjkod. Utöver det så har jag checkat av och gjort vad som önskades i denna uppgift.
Min påskkampanj sida hittas på denna länk: https://past.webmastern.nu/pask-kampanj/
- Skicka ett mailutskick med ett speciellt Påskerbjudande till de som prenumererar på nyhetsbrevet eller är med i kundklubben. Lägg först till mailadressen student@highendmedia.se i mailgruppen. Missa inte att utm-tagga kampanjlänken så att den sedan kan följas upp i Google Analytics.
Detta är fixat. Se inbox. Spårningen fungerar, skärmdumpen visar när jag själv skickat ett test mail och öppnat.
- Vilka automail skickas från din webbplats i samband med olika händelser? Beskriv och visa på exempel.
Både jag och kunden får mail aviseringar rörande ett köp. Jag får en notering att jag har fått en ny beställning, och kunden får en orderbekräftelse. Dessa är synkade med woocommerce, vi kunde inte göra några större automatiseringar i mailchimp med gratis versionen. Där kunde endast nyhetsbrev etc göras.
- Kunder vill ofta få snabba svar på korta frågor, visa på implementerad chatfunktion och hur den är anpassad för att den ska passa in i webbplatsens design.
Vi testade flera olika chatbotar. Tex Tawk.to samt Tidio. Det slutade med att vi installerade Tidio, se printscreen. Har dock tagit bort den nu då det endast var en kort free trial period. Tycker att chatbotarna fungerade sådär rent allmänt, på gratis versionerna. De behöver nog en del tid och arbete för att bli bra.
- Vad har du implementerat för kopplingar till företagets sociala medier? Beskriv och visa på exempel.
Se printscreen. Jag har tydliga sociala medier ikoner i footern som är klickbara. Man kommer till startsidan på samtliga just nu, då jag inte gjort några verkliga företagskonton på de olika plattformarna i detta projekt.
- Hur har du arbetat med Cookie-hantering och integritetspolicy?
Jag har installerat ett tillägg som heter ”cookiebot”, detta gör att besökaren får upp en banner när den besöker sidan, med val om att acceptera eller neka cookies. Jag har även anpassat och designat den, med lite mer passande färger samt även lagt till en liten logga. Har också ändrat språket från engelska till svenska. Sedan har det gjorts en synkronisering mellan GTM och denna bot, så att spårning kan göras, eller inte. Detta gjordes genom att vi implementerade en kod i GTM. Se bild nedan.
- Vilka andra åtgärder har du vidtagit för att skapa en säker webbplats?
Webbplatsen är SSL certifierad, vilket ger en stor trygghet för besökaren. Samt att den har ett spamskydd, Wordfence för att skydda mot yttre hot mot min webbplats.
- Hur har du arbetat med att optimera bilder för webben?
Beskriv och visa på exempel.
Beskärt de i rätt storlek samt använt ett passande fil format. En del bilder behövde också komprimeras för att inte ta så stort utrymme. Jag har arbetat med AI för att generera och ta fram mina produktbilder, på så sätt blir det mer mina ”egna”, istället för att bara ta och kopiera produktbilder från någon annan sida.
- Visa på exempel på designdelar som du anpassat med hjälp av Elementor.
Jag har använt Elementor på ett flertal sidor. Startsidan är designad med hjälp av Elementor. Så som tex. Bildkarusell, rörelseeffekt, färgval. Även påskkampanjsidan är designad med Elementor.
- Vilka tillägg har du använt och varför? Komplett lista önskas.
De flesta tillägg finns både i en gratis och en PRO version, vi har använt gratis versionerna på våra hemsidor. De varierar hur bra de är, men på de flesta tillägg går det att göra en del på gratisversionerna.
Mina installerade tillägg är:
Yoast SEO – Ett välkänt samt bra SEO tillägg som hjälper till att visa på förbättringar i SEO arbetet.
Wordfence Security – En hjälp för min del att hålla min webbplats fri från hackare och spam överlag.
WooCommerce – Tillägget som hanterar produkter och gör att wordpress sidan blir en ehandel.
Redirection – Tillägg där man lätt och smidigt kan göra redirections (omdirigeringar) från en sida till en annan.
Mailchimp for WooCommerce – Mailhanteringssystem som är bra för att skapa tex nyhetsbrev, kampanjutskick etc.
GTM4WP – A Google Tag Manager (GTM) plugin for WordPress – Hjälper till att koppla ihop Google Tag manager med vår wordpress sida.
Elementor – En page builder, alltså ett designverktyg där man bygger sidorna.
Cookie banner plugin for WordPress – Cookiebot CMP by Usercentrics – Ett verktyg som hjälper oss med Cookie hanteringen.
Child Theme Configurator – För att skapa ett child theme (en kopia av vårt tema, så att detta ej blir förstört vid eventuella uppdateringar)
Contact Form 7 – Ett kontaktformulär verktyg, som jag gick på rekommendation och installerade.
Popup Builder – Designa och göra egna pop-ups. Tex som “anmäl dig till vårt nyhetsbrev”
Smart Slider 3 – För att kunna bygga responsiva bildspel.
- Google har ett flertal verktyg för att kontrollera Page Speed och mobilvänlighet. Testa Verktygen nedan och kommentera resultatet. I de fall du kan göra förbättringar, gör även dessa för att visa på före/efter.
Mitt resultat finns bifogat på printscreen nedan. Jag tycker att det är ett helt okej resultat. Jag fick lite förbättringsåtgärder i diagnostiken som innebar “minska serverns första svarstid”, vilket är något jag inte kan påverka. Sen var det lite rörande bilder samt bildformat där jag kan se över och eventuellt förbättra lite. Överlag tycker jag att min sida svarar relativt bra och snabbt när jag använder den med ett bra nätverk. Rörande mobilt page speed var resultatet något sämre. Där fick jag främst förbättring angående
- Minska arbetsbelastningen på modertråden
- Minska påverkan från tredjepartskod, och liknande vilket känns svårt att påverka. Annars var det att minska ner bilder lite vilket går att åtgärda. Gjorde vissa förbättringar, och resultatet steg något vilket visas nedan:
- Vid en teknisk validering av din webbplats, finns det några andra brister som du identifierat? Vilka av dessa har du i så fall åtgärdat och vilka kvarstår att arbeta vidare med?
Bla. så saknade jag meta descriptions på en del produkter, detta är mycket viktigt och har åtgärdats. Även fokusnyckelordsfras har jag sett över så att detta finns på alla produkter. Jag har även arbetat med redirects, för att undvika 404:sidor osv. Indexeringen är ju mycket viktig, denna har jag också arbetat med så gott det går. Sidan är indexerad och antalet indexerade sidor ökar.
- Vilka andra åtgärder har du vidtagit för att skapa en snygg, inspirerande och effektiv webbplats som på bästa sätt levererar utifrån din affärsidé?
Jag har hållt mitt tema som jag satt med färger, hållt det ganska stilrent och utan allt för mycket krusiduller. Det är enkelt att hitta, samt att ta sig till rätt produkter. Jag har även lagt till olika “attention seekers” i form av rörelseeffekter. Detta tycker jag gör mycket. Från att vara en ganska tråkig och platt sida, så blev den genast mer intressant och levande. Att det hände något litet direkt när man går in på den, eller när man scrollar ner lite.
Patricia Stefansson
Past | Design