Økende hastighet og legge til raske utdrag i Magento

Så langt i denne serien har vi gjort de fleste av de nødvendige trinnene for optimalisering på stedet. Nå, i den tredje delen av denne serien, lærer du hvordan du optimaliserer Magento-installasjonen din for å redusere sidetilpasningstiden, og hvordan du integrerer rike utdrag for å gjøre søkeresultatene dine mer profesjonelle..

Økende hastighet

Redusere sidetilpasningstiden er en bekymring for alle webutviklere. Magento, som er en gigant av et CMS, er ikke veldig fort, men å gjøre noen små modifikasjoner kan øke ytelsen.

Å redusere sidetilpasningstiden er ikke bare nødvendig for å forbedre brukeropplevelsen og redusere studsekursen, men også for å hjelpe deg med å rangere godt i søkemotorer. Siden 2010 gir Google spesiell betydning for en nettsidees sidetid for å bestemme sidens rangering. Her vil vi kort diskutere noen raske og gjennomførbare måter å redusere sidenes lastetid for Magento-butikken din.

Den raskeste og enkleste måten å gjøre Magento-nettstedet ditt raskt, er å gjøre noen små endringer i Magento-administrasjonspanelet. Først av alt, aktiverer vi Magento-hurtigbufferen. Dette lille trinnet alene vil redusere sidetilpasningstiden med 30% til 40%. 

Når Magento-hurtigbufferen er aktivert, trenger Magento ikke å laste alle sidens ressurser fra serverne ved hver sideforespørsel. For å aktivere Magento-hurtigbufferen, gå til System> Cache Management. Velg alle cachetyper og fra rullegardinmenyen øverst til høyre nederst, velg Aktiver og sende inn.

For det andre må vi slå sammen våre CSS- og JS-filer før sidegengivelsen. Vi går til System> Konfigurasjon> Utvikler. Her ser du Merge JavaScript-filer og Slå sammen CSS-filer. Sett begge disse feltene til Ja, og treffer Lagre.

Denne sammenslåingen av CSS og JS-filer vil redusere antall forespørsler til serveren mens siden lastes. Dette vil igjen redusere sidelastningstiden betydelig.

Deretter kjører vi Magento-kompileringsprosessen. Samlingsfunksjonen til Magento vil kompilere alle Magento-filer for å lage en enkelt inkludere vei for økt ytelse. Dette reduserer sidelastningstiden med 25% til 50%. 

For å kunne bruke dette verktøyet, katalogen inkluderer og filen omfatter / config.php må begge skrives. For å starte kompileringsprosessen, gå til System> Verktøy> Samling. I øverste høyre hjørne ser du Kjør kompileringsprosessen knapp. Klikk på det, og du vil bli ferdig.

Deretter har vi noen få avanserte tiltak for å redusere sidebelastningstid som krever endring av innhold i .htaccess fil. Det kan være mange .htaccess filer i en Magento-katalog, men her redigerer vi den som finnes i rotkatalogen. 

Gjennom .htaccess fil, vil vi først gjøre innholdskoding, som vil komprimere filen før du sender den til den forespørende agenten. Dette vil redusere filnedlastingstid. For det andre vil vi legge til utløpsvarighet til overskrifter. Dette betyr at når du laster ned ressurser, vil nettleseren kontrollere om overskriftene er utløpt. Hvis de ikke har det, vil de bufrete versjonene bli brukt.

For å aktivere komprimering, unngent denne koden i standardinnstillingen .htaccess fil, dvs. fjerner # før php_flag zlib.output_compression on:

################################################################??????????????????????????? zlib.output_compression on ###############################################################################################

For å sette gzip-komprimering til handling, legger vi disse linjene inn i .htaccess fil:

################################################### følge SetOutputFilter DEFLATE # Sette inn filter bare på utvalgte innholdstyper AddOutputFilterByType DEFLATE tekst / html tekst / vanlig tekst / xml tekst / css text / javascript application / javascript # Håndtere noen Netscape 4.x problemer BrowserMatch ^ Mozilla / 4 gzip-only-text / html # Håndtere noen Netscape 4.06-4.08 problemer BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip # Scenario: MSIE masquerades som Netscape BrowserMatch \ bMSIE! No-gzip! Gzip-only-text / html # Kommando for ikke å komprimere bilder SetEnvIfNoCase Request_URI \. (?: gif | jpe? G | png) $ no-gzip dont-vary # Håndtering Proxies riktig Header append Vary Bruker-agent env =! Dont-vary ################################ ################################

Til slutt, la oss plassere en utløpsgrense på overskriftene, ved å legge til denne koden i .htaccess fil:

############################################  # Først av alt aktiverer utløp ExpiresActive On # Standard utløp ExpiresDefault "tilgang pluss 1 måned" # For favicon ExpiresByType image / x-icon "tilgang pluss 1 år" # Angi bilder Utløper ExpiresByType image / gif "tilgang pluss 1 måned" ExpiresByType image / png "tilgang pluss 1 måned" ExpiresByType bilde / jpg "tilgang pluss 1 måned" ExpiresByType image / jpeg "tilgang pluss 1 måned" # Angi CSS utløp ExpiresByType text / css "tilgang 1 måned" # For Javascript utløper ExpiresByType applikasjon / javascript "tilgang pluss 1 år "  ############################################

En svært viktig ting å vurdere for å forbedre hastigheten på Magento-butikken er valget av server. Denne Tuts + -artikkelen gjør en god jobb med å forklare faktorene du bør vurdere for å sikre at servervalgene dine passer bra til Magento.

Implementere rike utdrag

Nå er det på tide å utarbeide en måte å implementere skjemaer eller rike utdrag på - i Magento-butikken. De vil ikke bare gjøre søkeresultatene dine mer profesjonelle og hjelpe dem til å skille seg ut, men de vil også øke klikkfrekvensen på søkesider. 

De rike utdragene vi integrerer i denne opplæringen, er produkt-, tilbuds- og aggregeringsvurdering, og til slutt vil jeg gi deg noen ressurser til å implementere breadcrumbs og organisasjonsskjemaer.

Som standard ser resultatene i søkemotorresultatsidene ut slik:

Gjennom implementering av rike utdrag kan de skille seg ut og se slik ut:

Vær oppmerksom på at implementering av disse utdragene krever redigering av malfiler. Du må ha litt grunnleggende forståelse av HTML og PHP for å implementere dem. Sørg også for at du beholder en sikkerhetskopi av hver fil før du redigerer den.

Vi starter med å implementere produktordningen. Åpne denne filen i editoren din: app / design / frontend / [pakke] / [tema] /template/catalog/product/view.phtml og legg til den merkede koden i produkt-view klasse.

La oss nå merke navn, beskrivelse og bilde. For å merke et produktnavn, finn h1 tag som inneholder produktnavnet, og legg til følgende kode i den:

productAttribute ($ _ product, $ _ product-> getName (), 'name')?>

Nå for å merke beskrivelsen, finn produktbeskrivelsen div og sørg for at den inneholder attributter i følgende kode:

productAttribute ($ _ product, nl2br ($ _ product-> getShortDescription ()), 'short_description')?>

Neste, i app / design / frontend / [pakke] / [tema] /template/catalog/product/view/media.phtml, finn bildekodene (du finner to forekomster av dem på linjene 40 og 62 hvis du bruker standardtemaet), og sørg for at de inkluderer følgende:

$ _img = ''. $ this-> escapeHtml ($ this-> getImageLabel ()).''; $ _img = ''. $ this-> escapeHtml ($ this-> getImageLabel ()).'';

Nå legger vi til produktsammenligningsinformasjon. For det, åpne denne filen:

app / design / frontend / [pakke] / [tema] /template/review/helper/summary.phtml

Erstatt den komplette koden til denne filen med koden nedenfor:

getReviewsCount ()):?> 
getRatingSummary ()):?>

getReviewsUrl ()?> ">__ ('% d Review (s)', $ this-> getReviewsCount ())?> | getReviewsUrl ()?> # review-form ">__ ('Legg til din anmeldelse')?>

getDisplayIfEmpty ()):?>

getReviewsUrl ()?> # review-form "> __ ('Bli den første som omtaler dette produktet')?>

Nå for å vise produkttilbud, åpner du følgende fil:

app / design / frontend / [pakke / [tema] /template/catalog/product/view/type/default.phtml

Legg til denne koden ved starten av koden, etter de første kommentarene (som skal være rundt linje 28):

isAvailable ()):?>

__ ('Tilgjengelighet:')?> __ ('På lager')?>

__ ('Tilgjengelighet:')?> __ ('Ikke på lager')?>

Og i slutten av filen legger du til denne koden:

For å legge til prisen, åpne denne filen:

app / design / frontend / [pakke] / [tema] /template/catalog/product/price.phtml

Pass på at du legger til de riktige attributter for koden i hver forekomst av klassene pris og vanlig pris. For hver forekomst av span med klassen pris vi legger til det uthevede itemprop tag inn det:

... 

På samme måte for hver span med klassen vanlig pris, vi legger til den uthevede koden i den:

 valuta ($ _ pris + $ _weeeTaxAmount, sant, sant)); ?>

Ved å bruke teknikker som dette, kan du også legge til breadcrumbs til dine rike utdrag. En utmerket opplæring på dette er Google Rich Snippets i Magento. Ikke glem å teste samtidig mens du implementerer disse skjemaene. Du kan bruke de gratis testverktøyene til Google og Bing til testformål.

Når du har implementert alle disse rike synkene i Magento-butikken din, vil du legge merke til en betydelig økning i trafikken på nettstedet ditt hvis du allerede rangerer godt i søkemotorer.

Konklusjon

Så langt, bør vi ha et fullt SEO-optimalisert Magento-nettsted med svært god sidetilpasningstid og profesjonelle søkeresultater. 

I den neste artikkelen i denne serien vil jeg forklare noen SEO-hensyn for å lage et multi-butikkoppsett for Magento, og gi et raskt overblikk over noen nyttige Magento-utvidelser for SEO-formål.