Skip to content

Allt om WordPress, webbutveckling — och mer därtill

🛠 Byta namn på Shapely-temat för ditt projekt: komplett guide

🛠 Byta namn på Shapely-temat för ditt projekt: komplett guide

Tog ett gratistema, döpte om det och fick en helt skräddarsydd utveckling. Låter enkelt, men när du öppnar Shapely-katalogen i en editor spretar blicken: dussintals filer, var och en med det gamla namnet. Funktioner med prefixet shapely_, textdomäner, sökvägar till assets, beskrivningar i style.css-huvudet. Missa en enda så går temat sönder.

Shapely från Colorlib är en av de bästa gratisgrunderna för egen utveckling: 10 000+ aktiva installationer, 4,6 i betyg på WordPress.org, senast uppdaterad april 2025. En one-pager med parallax-sektioner och WooCommerce-stöd som förvandlas till en unik produkt för en specifik kund efter en halvtimmes redigering.

Här nedan är den kompletta sekvensen för att ersätta Shapelys temanamn med ditt eget. Från massomdöpning av filer till den slutliga skärmbilden, utan hopp och med beprövade verktyg.

💡 Snabb översikt:

  • Ladda ner Shapely från den officiella sidan och kopiera temakatalogen med ett nytt namn.
  • Massdöp om filer och mappar: ersätt det gamla shapely-prefixet med ditt eget i gemener.
  • Sök och ersätt alla förekomster av shapely och Shapely i PHP-, CSS- och JS-filer med hänsyn till versaler/gemener.
  • Fixa function.php, dokumentation och customizer, skriv om style.css med det nya temanamnet.
  • Förbered en egen screenshot.png och kontrollera temaaktiveringen i adminpanelen.

Varför döpa om Shapely istället för att skriva från grunden

Att skriva ett tema från ett blankt blad för ett vanligt projekt är slöseri med budget. Shapely ger ett färdigt ramverk: Bootstrap-layout, widgets för startsidan, stöd för populära tillägg direkt ur lådan. Du får en fungerande produkt och ändrar bara det kunden behöver: färger, typsnitt, sektionsstruktur och, naturligtvis, namnet.

Omnamning är inte kosmetiskt. Att ändra namnet i alla filer och funktioner gör temat till ditt: det visas i adminpanelen under ditt varumärke, det krockar inte med original-Shapely (du kan ha båda på samma sajt), och kunden ser skräddarsydd utveckling, inte ett "gratistema från internet".

I praktiken tar hela cykeln 30-40 minuter. Låt oss bryta ner varje steg.

Steg 1: ladda ner och kopiera katalogen

Ladda ner Shapely från colorlib.com eller från WordPress.orgs repository. Packa upp arkivet.

Skapa en kopia av katalogen shapely och döp den till ditt temanamn. Regel: endast gemena latinska bokstäver och bindestreck. Inga mellanslag, understreck eller versaler. Exempel på korrekta namn: trolleybus, mediadoma-theme eller custom-start.

Varför gemener: WordPress normaliserar tema- och tilläggsnamn till gemener vid kontroll av uppdateringar och arbete med textdomäner. En versal i mappnamnet är en säker väg till "white screen of death" vid aktivering.

Steg 2: massomdöpning av filer

Första vändan, fil- och mappnamn. Shapely har flera dussin, och många innehåller shapely direkt i namnet: shapely-documentation.php, class-shapely-customize.php och så vidare.

I Total Commander: öppna temakatalogen, Ctrl+B (platt lista), Ctrl+A (markera alla), Ctrl+M (massomdöpning). I fältet "Sök efter" anger du shapely, i fältet "Ersätt med" det nya namnet (gemener). Kör, alla filer och mappar döps om på en sekund.

Alternativ utan Total Commander, PowerShell. Öppna en terminal i temakatalogen och kör:

1Get-ChildItem -Recurse | Where-Object { $_.Name -like '*shapely*' } | Rename-Item -NewName { $_.Name -replace 'shapely', 'newname' }

Ersätt newname med din version. Denna metod är gratis och fungerar på vilken Windows som helst utan att installera ytterligare program.

Steg 3: sök och ersätt i filinnehåll

Nu det viktigaste, städa bort omnämnanden av shapely inuti PHP-, CSS- och JS-filer. Det finns dussintals av dem, och manuell sökning är inget alternativ här.

I Notepad++: Ctrl+Shift+F (sök i filer), katalog, din nya temamapp. Första vändan, ersätt shapely (gemener) med newname. Andra vändan, ersätt Shapely (versal) med Newname. Aktivera alternativet "Matcha skiftläge" för varje vända.

Specifika platser där temanamnet garanterat förekommer:

  • function.php, hooken after_setup_theme, anropen wp_enqueue_style och wp_enqueue_script med prefixet shapely_;
  • wp-content/themes/yourtheme/inc/trolleybus-documentation.php, hjälptext i adminpanelen;
  • wp-content/themes/yourtheme/inc/class-customize.php, customizer-inställningar.

Notera: ändra inte bara textsträngar, utan även funktionsnamn. shapely_get_option() ska bli yourtheme_get_option(). Annars, när två teman installeras på samma sajt, kommer PHP att kasta ett fatalt fel "Cannot redeclare function."

Steg 4: fixa style.css, temametadata

Filen style.css i temaroten är "passet": WordPress läser dess huvud och visar information i sektionen "Utseende → Teman". Exempel:

1/*
2Theme Name: Trolleybus
3Theme URI: https://your-site.com/
4Author: Your Name / Studio
5Author URI: https://your-site.com/
6Description: Custom theme based on Shapely — a one-pager with parallax sections, WooCommerce support, and responsive layout. Optimized for a specific project.
7Version: 1.0
8License: GNU General Public License v2 or later
9License URI: http://www.gnu.org/licenses/gpl-2.0.html
10Text Domain: themename
11*/

Tre fält är obligatoriska: Theme Name (temanamn i adminpanelen), Text Domain (måste matcha mappnamnet, WordPress använder det för översättning) och Version. Resten är valfritt, men Author och Description skapar ett professionellt intryck.

Text Domain är ett kritiskt fält. Om det inte matchar mappnamnet kommer funktionen load_theme_textdomain() inte att hitta översättningar, och alla strängar i adminpanelen förblir på engelska.

Steg 5: förbered en egen screenshot.png

screenshot.png ligger i temaroten och visas i galleriet "Utseende → Teman". Storlek: enligt WordPress.orgs krav för temapresentation. Format: PNG.

Vad du ska placera på skärmbilden: studiologotyp, temanamn och en skärmdump av startsidan efter anpassning. Lämna inte kvar den ursprungliga Shapely-skärmbilden, kunden ser någon annans produkt och ställer frågor.

Verktyg: Photoshop, Figma eller gratisalternativet GIMP. Rita en bakgrund, lägg till temanamnstext, infoga en skärmdump av startsidan. Spara som screenshot.png och ersätt filen i temaroten.

Arbetsplats för WordPress-utvecklare med kod på skärmen

Steg 6: slutkontroll

Innan du överlämnar till kunden, kontrollera tre saker:

  • Aktivering utan fel. Gå till "Utseende → Teman" och aktivera det nya temat. Vit skärm, gå tillbaka till steg 3, troligtvis har en funktion med prefixet shapely_ missats.
  • Namn i adminpanelen. Temalistan visar värdet Theme Name från style.css, exakt vad du angav.
  • Customizer-funktionalitet. Öppna "Utseende → Anpassa" och gå igenom sektionerna. Om något alternativ inte sparas, kontrollera inc/class-customize.php (steg 3), kanske finns en gammal alternatividentifierare kvar där.

Det var allt. Temat är redo att arbeta och bär ditt namn. Shapely fungerade som grund, men produkten är nu helt din.

Varför göra så här och inte via ett barntema

Vanlig fråga: varför inte skapa ett barntema och ändra namnet i det? Svaret beror på scenariot.

Ett barntema passar när du finslipar en sajt för eget bruk: ändrar CSS, lägger till funktioner i functions.php, men original-Shapely förblir basen och får uppdateringar. Detta är rätt väg för en sajtägare.

För en byrå eller frilansare som levererar ett projekt till en kund är ett barntema en kompromiss. Kunden ser "Shapely" i adminpanelen, och när föräldratemat uppdateras kan dina redigeringar gå sönder (utvecklarna ändrade sektionens HTML-uppmärkning, din CSS-fix slutade fungera). Fullständig omnamning ger kontroll över varje fil och eliminerar beroendet av Colorlibs uppdateringar.

Slutsats: gör du det för dig själv, barntema. Gör du det för en kund, fork med omnamning.

⁉️🤔 Vanliga frågor

Kan jag döpa om ett tema utan Total Commander?

Ja. På Windows 10/11 använd PowerShell (kommando från steg 2), på macOS Finder med massomdöpning eller verktyget rename i terminalen. På Linux, rename 's/shapely/newname/' *. Huvudsaken är att inte missa nästlade mappar: PowerShell med flaggan -Recurse går igenom hela trädet, medan Finder bara markerar filer i den aktuella mappen.

Vad händer om jag lämnar kvar gamla shapely-omnämnanden i koden?

Beror på platsen. Om det gamla prefixet finns kvar i ett funktionsnamn, när två teman med samma funktionsnamn installeras kommer PHP att kasta ett fatalt fel, sajten kraschar. Om i en sökväg till en asset, kommer bilden eller skriptet inte att laddas (404). Om i textdomänen, kommer översättningssträngar inte att hittas. Värsta scenariot: sajten fungerar, du levererar projektet, och en månad senare installerar kunden original-Shapely av nyfikenhet och får en vit skärm. Två teman med funktionerna shapely_setup() i en WordPress samexisterar inte.

Uppdateras Shapely efter omnamning?

Nej. Du har forkat temat, uppdateringar från Colorlib når dig inte. Detta är ett medvetet beslut: du offrar automatiska uppdateringar för full kontroll. Om en kritisk säkerhetspatch kommer i original-Shapely applicerar du den manuellt, kirurgiskt. I praktiken är stabilitet viktigare för teman än uppdateringar: ett tema är inte ett tillägg, sårbarheter i det är sällsynta. Alternativ för den som vill ha både kontroll och uppdateringar, ett barntema, men vid leverans av ett projekt till en kund är en fork mer tillförlitlig.

Är Shapely ett tema endast för one-pagers?

Till sin design, ja. Men Bootstrap-layouten och den modulära strukturen tillåter att använda det för flersidiga sajter också: skapa bara ytterligare sidor i WordPress och sätt upp en meny. Startsidans widgets (parallax, portfölj) fungerar bara på den sida som tilldelats som "Startsida" i inställningarna. I praktiken har vi byggt bloggar och produktkataloger på Shapely, ramverket är initialt flexibelt.

Vad gör man med skärmbilden om det inte finns någon designer?

Ta en skärmdump av den färdiga startsidan (Snipping Tool i Windows eller Cmd+Shift+4 på macOS), öppna den i Canva (gratis, online), lägg över temanamnet och studiologotypen, ladda ner som PNG i önskad storlek. På 10 minuter får du ett professionellt resultat utan Photoshop. Huvudsaken är att inte lämna kvar Shapely-skärmbilden: kunden ser just detta när de väljer tema i adminpanelen, och någon annans varumärke på den platsen undergräver förtroendet för ditt arbete.

Vad du ska göra efter omnamning: nästa steg

Temat är omdöpt och aktiverat. Nästa steg, anpassning för ett specifikt projekt: byta färgschema i customizern, sätta upp startsidans widgets, ansluta WooCommerce om en butik behövs, SEO-optimering via Yoast SEO eller Rank Math.

Börja med customizern: "Utseende → Anpassa", och gå uppifrån och ner. Shapely matar ut dussintals alternativ där: från logotyp till sidfot. På en timmes anpassning får du ett unikt utseende utan att skriva en rad kod. Och om projektet kräver djupare anpassning har du redan din egen fork där du kan lägga till vilka funktioner som helst utan att titta tillbaka på originalet.

Om sajten planeras att vara flersidig, skapa först mallar för interna sidor i temamappen. Och kom ihåg: omnamningen befriade dig från konflikter med originalet, nu kan Shapely och ditt tema leva på samma sajt oberoende av varandra.