HubSpot CMS Innovation med Job Diva Integration för Linium

0 Shares

Utmaningen:

Linium Recruiting kom till New Breed för att flytta sin webbplats till HubSpot CMS och helt integrera webbplatsen med sin talangförvärvsplattform, JobDiva. JobDiva i sig är en otroligt robust SaaS-plattform som inte bara erbjuder talangförvärv utan även CRM och ekonomisk hantering, så vi visste att det skulle bli en allvarlig utmaning att införliva denna plattform i CMS.

Syftet med sajten var att tillåta arbetssökande att skapa en profil på sajten, ladda upp eller skapa sina CV, söka och ansöka om jobb och registrera sig för varningar om nya jobbannonser. Detta var inte precis en standard HubSpot COS-funktionalitet.

Processen:

New Breed arbetade med Linium Recruiting genom vår standardprocess för omdesign av webbplatser för CMS med tillägg av en implementeringsplan för hur JobDiva-gränssnittet sömlöst kan integreras i webbplatsen. För att göra det bestämde vi oss för att det bästa tillvägagångssättet skulle vara att iframe och omskinn JobDiva för att matcha layouten och designen på den nya Linium Recruiting-webbplatsen. Med denna lösning i åtanke arbetade vi igenom standarddesignprocessen för att utforma strategin för informationsarkitektur och skapa designkoncept för att matcha. Dessa koncept införlivade hur JobDiva skulle lägga till den nya webbplatsen.

När det väl kom till att skriva koden för att införliva JobDiva i sajten, tvingades teamet tänja på gränserna för CMS, JavaScript, COS RSS-modulerna, anpassning och styling i den bakre delen av JobDiva själv. Det finns några nyckelelement på webbplatsen som verkligen representerar det arbete som teamet behövde göra för att få den här integrationen att hända.

Den första är JobDivas huvudsida som visar alla aktuella lediga jobb. Som du kan se på bilderna nedan – när du tittar på den inbyggda JobDiva-skärmen och Linium-webbplatsen – är det knappt att känna igen:

JobDiva standard:

jobdiva-listningssida

Linium Rekryteringsutförande:

linium-rekrytering-utförande-screengrab

För att få detta att hända använde teamet en iframe som inhyste hela JobDiva-webbplatsen som planerat. JavaScript och CSS användes för att ordna om JobDiva-gränssnittet. CSS och JavaScript lades in i rubriken på JobDiva-plattformen och hjälpte teamet att arrangera om elementen i JobDiva-plattformen för att matcha våra önskade koncept. Ett inneboende problem med att använda iframes är att de nästan alltid har en inställd höjd och en rullningslist på sidan, vilket ger en mindre än idealisk användarupplevelse. Så motståndet på den här sidan, som tog upp detta problem, var att teamet implementerade två skript: ett inuti JobDivas baksida och det andra på HubSpot CMS-sidan. Dessa skript skickar information fram och tillbaka: JobDiva iframe upptäcker sidans fulla höjd och berättar för HubSpot-sidans kod vad det är, så att ramen justeras och tittaren inte känner att han eller hon har lämnat Linium-webbplatsen.

Den andra huvudplatsen som JobDiva behövde integreras var på webbplatsens hemsida:

linium-rekrytering-jobb-listning

För att göra detta använde teamet HubSpot RSS-flödesmodulen för att visa de senaste jobbannonserna från JobDiva. RSS-formatet från JobDiva behövde dock analyseras och formateras med hjälp av HubSpot RSS-verktyget för att bara isolera titel, plats och datum. Sedan formaterade teamet dem så att de matchade tabellen som visas på fronten (här är ett exempel på den oformaterade/otolkade RSS-listan). Utöver detta behövde länken till det specifika jobbet lagras som en variabel och läggas in i iframen på den efterföljande sidan, så att alla karriärer kan ses på www.liniumrecruiting.com/jobs, där JobDiva iframe bor.

Här är den normala iframe-koden för att visa standardvyn för jobblistor:

Den fetstilta texten är webbadressen som visar standardsidan för jobblistor. “a=d2jdnwvqczztcj6k2…”-delen är ett specifikt ID som ges till Linium så att det kommer att visa rätt portal.

Här är ett exempel på hur vi kunde få sökningen från hemsidan att fungera genom att lägga till den variabeln i webbadressen:

http://www2.jobdiva.com/candidates/myjobs/searchjobsdone.jsp?a=d2jdnwvqczztcj6k2nwje8t8dlby0201a5tk14dmebwyddkyzy3g82kc9l824gba&SearchString=” +värdet

Vi sparade termerna som de sökte efter som en variabel som heter “thevalue” och ersatte standard “src” med denna nya som inkluderade det lagrade värdet. Till exempel, om någon skulle söka “newbreed” på hemsidan, skulle iframen visa denna sida.

Utöver detta hade den inbyggda JobDiva-karriärsökningsfunktionen som ses på hemsidan som standard “OCH”, inte “ELLER”, logik om flera söktermer angavs. Till exempel, om en användare skrev “Teaching Albany” skulle han eller hon bara se listor med båda dessa nyckelord. Linium ville att den här sökningen skulle ha “ELLER”-logik, så teamet skrev Javascript för att säga att om en användare sökte på flera ord, skulle den fråga “teaching” OR “Albany” för att ge fler resultat.

Allt detta, och vi har inte pratat om delen för att skapa CV ännu! Det här avsnittet låter dig ladda upp, kopiera och klistra in eller skapa ett CV. Genom alla de olika layouterna i denna sektion hade JobDiva använt olika

-klasser och ID:n, så varje mall behövde vara helt och unikt utformad för att ta hänsyn till detta. CV-utmatningarna byggdes i HTML-tabeller, en något föråldrad utvecklingsmetod, och de skapade många tomma celler. För att rätta till detta skrev teamet kod för att hitta och dölja tomma rader och celler i tabellerna, förutom att utforma dem på lämpligt sätt för att matcha resten av webbplatsen.

Slutligen, på JobDiva-integrationsdelen av projektet, skapades ett anpassat jobbvarningsformulär så att användare kan ange olika alternativ och få skräddarsydda jobbresultat skickade till sig via e-post. För att åstadkomma detta registrerades alla olika formulärinmatningsvariabler med hjälp av lokal lagring. De placerades också i källan till en dold iframe på omdirigeringssidan för formuläret och skickades till JobDiva så att e-postmeddelanden med jobbmeddelanden skulle skickas korrekt.

Bara för JobDiva-delen fanns det mer än 200 rader JavaScript och en CSS-fil med 1 828 rader kod. Detta är ungefär hälften av vad vi skulle förvänta oss för ett stort webbplatsprojekt enbart, och detta stod bara för JobDiva iframe-delen av projektet.

Utöver JobDiva och HubSpot CMS-integreringssidan av projektet, innehöll webbplatsen också några spännande CMS-element. Dessa inkluderade teamsidan, där vi använde MixItUp – ett vanligt filterplugin – och HubSpot-bloggfunktionen för att skapa en sida som skulle filtrera efter plats.

Lösningen:

I slutet av dagen levererades Linium Recruiting en HubSpot CMS-webbplats sömlöst integrerad med JobDiva – en bedrift som, enligt JobDivas kännedom, aldrig tidigare hade försökts, aldrig har implementerats framgångsrikt.

0 Shares