I den här artikeln kommer vi att täcka grunderna i Magento-mallfiler. Vi kommer att gå över sin introduktion och göra några grundläggande ändringar.
Detta inkluderar att visa utvalda produkter på hemsidan och hur man laddar in JavaScript i sidfoten.
På grund av vår tidigare artikel har vi sett att layoutfilerna kontrollerar varje block i ett tema och bestämmer vad som inte får visas. Men vad som görs inuti det blocket är där mallfilerna kommer till handling.
I den här artikeln kommer vi att fokusera på följande kataloger:
app / design / frontend ///mall/
app / design / frontend /// Locale /
Om du bara har gått med oss, var god och kolla de tidigare artiklarna i den här serien.
Som referens har vi täckt:
Utan ytterligare ett gör, låt oss komma igång.
Magento mallfiler är PHTML-filer som består av en blandning av HTML och PHP, varav några gör en sida som 1column.phtml
medan andra gör specifika block inom en sida som header.phtml
.
För majoriteten av tiden under utveckling av en webbplats är det de filer som vi oftast kommer att arbeta med, för utvecklare på framsidan, det vill säga. När XML-filen är på plats och en mall kallas, förväntas filen analyseras och visas i enlighet därmed.
Det finns hundratals mallfiler tillgängliga, att veta vilken som ska redigeras och sedan spåra filen i hierarkin kan vara svårt när man först börjar.
Allt är bra men det finns några fina administratörsinställningar som kan hjälpa oss, de kommer att spara oss timmar av huvudvärk!
Viktigt att notera, vi kan bara använda följande inställningar på "Webbplats" eller "Store View" -omfånget, inställningarna är inte tillgängliga för oss i "Standard Config" -området, så vi måste komma ihåg att ändra räckvidd en gång inloggad . Det här är användbart men det betyder att vi kan växla inställningarna bara för en viss webbplats eller butikskarta i stället för globalt.
Dessa kommer snabbt att identifiera vilka filer som laddas för en viss sida genom att visa oss sökvägen till filen. Om du vill slå på eller stänga av den är en snabb inställningsändring i adminområdet.
Gå över till system> konfiguration. Gå sedan i menyn till vänster helt ner till botten och klicka på "Utvecklare" under "Avancerad" rubrik. När vi ändrat räckvidden till "Huvudwebbplats" så har vi inställningen tillgänglig för oss under "Debug".
Det verkar som om ingenting har hänt när du har klickat på Spara config, men om du går till webbplatsens främre ände, till exempel hemsidan och uppdatera sidan du kommer se tipsen kommer igenom.
Med det här vet vi nu var filerna är placerade, och om det behövs några ändringar bara kopiera filen från bas till tema och ändra efter behov.
Vi kan också ställa in "Lägg till blocknamn till tips" till "Ja" om vi vill ha mer information, används det generellt för utveckling av baksidan, så jag skulle inte oroa mig för denna inställning för mycket.
Nu vidare till koden. Jag kommer att köra igenom ett par modifieringar som ofta används i temat utveckling, men igen kommer jag bara att röra ytan på vad som är möjligt.
Låt oss börja…
Denna punkt måste vara den vanligaste förfrågan på vilken webbplats som helst, alla vill visa upp en handfull produkter på landningssidan på deras webbplats rätt?
Det är faktiskt mycket enklare än du kan föreställa dig, med en kombination av XML och PHP kan vi nå detta på nolltid. Det finns, som med många saker i Magento, mer än ett sätt att göra detta. Jag ska visa dig vad jag tycker är den enklaste metoden.
Först måste vi skapa vår kategori i adminområdet som håller våra produkter. En gång inloggad huvud över till katalog> hantera kategorier. För det här exemplet kommer vi att skapa en underkategori under rot, så vi måste klicka på "Root Catalog" och klicka sedan på "Lägg till underkategori" -knappen. Ange en titel för kategorin, se till att "Är aktiv" är inställd på "Ja" och klicka sedan på "Spara kategori".
Notera kategorin ID-nummer överst eftersom vi kommer att behöva det senare:
Det här är en bra tid att även lägga till några produkter i den kategori som vi just har skapat. För att göra detta klickar du på fliken "Kategori Produkter" och väljer de produkter du vill visa, inte glömma att klicka på "Spara kategori" när vi är färdiga.
Nästa upp måste vi skapa vår mall där vår för varje
slingan kommer att köras.
För detta kommer vi att basera den av produktlistan mallen som har all nödvändig kod redan gjort för oss, vi behöver bara göra några justeringar som passar våra behov.
app / design / frontend / bas / default / katalog / produkt / list.phtml
Kopia till:
app / design / frontend /
Vi gör då några ändringar i vår fil.
Den färdiga filen kommer att se ut som följer:
belastning ($ _ Kategorinr); $ _productCollection = $ _category-> getProductCollection (); $ _ProductCollection-> addAttributeToSelect ( '*'); ?>hämta namn(); ?>
räkna ()):?>__ ('Det finns inga produkter som matchar urvalet.')?>
- getProductUrl ()?> "title ="stripTags ($ this-> getImageLabel ($ _ produkt, 'small_image'), null, true)?> ">
getProductUrl ()?> "title ="stripTags ($ _ product-> getName (), null, true)?> "> hämta namn(); ?>
getRatingSummary ()):?> getReviewsSummaryHtml ($ _ product, 'short')?> getPriceHtml ($ _ produkt, sant)?>isSable ()):?>__ ('Slut i lager')?>
hjälpar ('önskelista') -> isAllow ()):?>
- hjälpar ("önskelista") -> getAddUrl ($ _ product)?> ">__ ('Lägg till i önskelista')?>
getAddToCompareUrl ($ _ product)):?>- | ">__ ('Lägg till jämförelse')?>
Glöm inte att ändra värdet på $ _categoryId
variabel till ditt kategori-ID.
Slutligen behöver vi bara skapa ett XML-block som laddas i mallen som vi skapat ovan. Vi gör det här i vårt local.xml
fil som så:
Det är allt där det är, ganska rakt fram rätt? Nedan visas en skärmdump av den färdiga produkten.
Till att börja med tror vi att Magento redan har denna förmåga inbyggd genom XML när vi lägger till våra skript, en sorts parameter som vi kunde passera in, men vi skulle ha fel - Magento kommer inte göra det så lätt för oss!
WordPress å andra sidan gör det här perfekt via wp_register_script
. Kanske kommer en back-end-utvecklare att hämta på detta och lägga till möjligheten att skicka igenom en extra XML-parameter, nu finns det ett sidoprojekt för att någon ska kunna spricka med.
Några takers?
Så, lyckligtvis för närvarande finns det en alternativ metod för att få detta till jobbet.
Jag tycker att det är viktigt att täcka detta ämne eftersom det kommer att förbättra hastigheten på vår webbplats som alla vill ha. Jag tenderar att lämna Magento kärna JavaScript-filer kvar som de är i , Jag kan begränsa dem men bortsett från det förblir de som de är.
Allt vi lägger till på toppen av Magento, som jQuery och våra egna anpassade funktioner, är det ingen skada när du laddar dem i sidfoten. När jag utvecklar en webbplats brukar jag hålla ett öga på tagg, när en tredjepartsmodul blir installerad, lägger den vanligtvis något till här. Med lite arbete kan vi redigera XML-modulen för tredje part och peka den för att ladda i sidfoten - det är väl värt de extra fem minuterna!
Först måste vi skapa ett XML-block i vårt local.xml
fil i standardlayouthandtaget som så:
skin_js js / build / jquery.min.js
Observera att vi använder samma metod för att lägga till JavaScript-filer som vi gjorde i föregående artikel. Om du behöver en uppdatering klicka här, för demonstrationsändamål lägger vi till i en lokal kopia av jQuery.
Nu kan vi gå om att skapa vår mallfil. Skapa en ny fil i:
app / design / frontend /
med följande innehåll:
getCssJsHtml ()?>
Slutligen måste vi lägga till en enda kodkod i våra mallfiler strax före stängningen märka.
Våra mallfiler finns på app / design / frontend / bas / default / sida /
inte glömma att kopiera dem till vårt eget tema. Det finns flera mallfiler, jag har samlat en lista tillsammans nedan:
1column.phtml
2columns-left.phtml
2columns-right.phtml
3columns.phtml
Nedan är ett exempel på hur det ska se ut:
... getAbsoluteFooter ()?> getChildHtml ('footer.js')?>