{"id":16040,"date":"2023-01-25T09:24:18","date_gmt":"2023-01-25T09:24:18","guid":{"rendered":"https:\/\/www.shoprenter.hu\/blog\/?p=16040"},"modified":"2024-03-26T15:41:21","modified_gmt":"2024-03-26T15:41:21","slug":"egyedi-lenyilo-menu-a-shoprenterben","status":"publish","type":"post","link":"https:\/\/www.shoprenter.hu\/blog\/egyedi-lenyilo-menu-a-shoprenterben","title":{"rendered":"Egyedi leny\u00edl\u00f3 men\u00fc a Shoprenterben"},"content":{"rendered":"\n<p><strong>Mit kell tudni az egyedi leny\u00edl\u00f3 men\u00fcr\u0151l?<\/strong><\/p>\n\n\n\n<p>Az egyedi leny\u00edl\u00f3 men\u00fc alatt egy olyan megold\u00e1st \u00e9rt\u00fcnk, ami az adott kateg\u00f3ria gy\u00e1ri leny\u00edl\u00f3j\u00e1t cser\u00e9li le egy HTML tartalomra asztali n\u00e9zeten.<\/p>\n\n\n\n<p><strong>Mi\u00e9rt j\u00f3 ez a web\u00e1ruh\u00e1znak?<\/strong><\/p>\n\n\n\n<ul><li>Sz\u00ednes\u00edthetj\u00fck a navig\u00e1ci\u00f3s \u00e9lm\u00e9nyt az oldalon.&nbsp;<\/li><li>Jobban kiemelhet\u00fcnk alkateg\u00f3ri\u00e1kat.<\/li><li>Szabadon form\u00e1zhatunk elemeket.&nbsp;<\/li><li>H\u00e1tt\u00e9rk\u00e9pekkel, kiemelt term\u00e9kekkel \u00e9s plusz tartalommal t\u00f6lthetj\u00fck fel a kateg\u00f3riaf\u00e1t.<\/li><\/ul>\n\n\n\n<p>Shoprenterben ez a be\u00e1ll\u00edt\u00e1s az admin fel\u00fcleten az adott kateg\u00f3ria szerkeszt\u0151 oldal\u00e1n a Leny\u00edl\u00f3 tartalom f\u00fcl alatt tal\u00e1lhat\u00f3. Alap\u00e9rtelmezetten csak a m\u00e1sodik kateg\u00f3ria r\u00e9teget l\u00e1tjuk, ha lenyitjuk a kateg\u00f3ri\u00e1t, viszont egyedi leny\u00edl\u00f3 haszn\u00e1lat\u00e1val ki tudjuk bontani jobban, megk\u00f6nny\u00edtve a navig\u00e1ci\u00f3t a l\u00e1togat\u00f3k sz\u00e1m\u00e1ra.<\/p>\n\n\n\n<p><strong>Egy egyszer\u0171bb leny\u00edl\u00f3 men\u00fc l\u00e9trehoz\u00e1s\u00e1hoz alap HTML \u00e9s CSS tud\u00e1s elegend\u0151 lehet, azonban&nbsp; egy \u00f6sszetettebb men\u00fch\u00f6z m\u00e1r <a href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles?utm_medium=other&amp;utm_source=srblog&amp;utm_campaign=egyedi-lenyilo-menu-a-shoprenterben_srblog_other\" target=\"_blank\" rel=\"noreferrer noopener\">fejleszt\u0151i er\u0151forr\u00e1s <\/a>aj\u00e1nlott.<\/strong> <\/p>\n\n\n\n<p>Fontos m\u00e9g megeml\u00edteni azt is, hogy az egyedi leny\u00edl\u00f3 men\u00fc teljesen elk\u00fcl\u00f6n\u00fcl a kateg\u00f3riaf\u00e1t\u00f3l, ez\u00e9rt ha pl. \u00e1tnevez\u00fcnk kateg\u00f3ri\u00e1kat, akkor a m\u00f3dos\u00edt\u00e1st a leny\u00edl\u00f3 men\u00fc HTML szerkeszt\u0151j\u00e9ben is el kell v\u00e9gezni.<\/p>\n\n\n\n<p>A Shoprenter gy\u00e1ri t\u00e9m\u00e1i k\u00f6z\u00fcl ebb\u0151l a szempontb\u00f3l kiv\u00e9tel a Las Vegas t\u00e9ma, mivel itt asztali n\u00e9zetben is a mobil men\u00fch\u00f6z hasonl\u00f3 megold\u00e1st tal\u00e1lunk.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Leny\u00edl\u00f3 men\u00fck a gyakorlatban:<\/h2>\n\n\n\n<p>Az egyedi leny\u00edl\u00f3 men\u00fc sz\u00e1mos m\u00f3don megval\u00f3s\u00edthat\u00f3, amely sokszor f\u00fcgghet a web\u00e1ruh\u00e1z term\u00e9kk\u00f6r\u00e9t\u0151l \u00e9s a kateg\u00f3riafa \u00f6sszetetts\u00e9g\u00e9t\u0151l. N\u00e9zz\u00fck meg, hogy mikor milyen leny\u00edl\u00f3 men\u00fc javasolt, annak \u00e9rdek\u00e9ben, hogy a web\u00e1ruh\u00e1z k\u00f6nnyed\u00e9n \u00e1tl\u00e1that\u00f3 legyen a l\u00e1togat\u00f3k sz\u00e1m\u00e1ra.<br><br><strong>1. A web\u00e1ruh\u00e1z term\u00e9kei sok, egym\u00e1st\u00f3l j\u00f3l elk\u00fcl\u00f6n\u00edthet\u0151 kateg\u00f3ri\u00e1ba sorolhat\u00f3k<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1140\" height=\"400\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu1.png\" alt=\"\" class=\"wp-image-16042\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu1.png 1140w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu1-1024x359.png 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu1-768x269.png 768w\" sizes=\"(max-width: 1140px) 100vw, 1140px\" \/><\/figure>\n\n\n\n<p>Ha egy web\u00e1ruh\u00e1zban sok az alkateg\u00f3ria, t\u00f6k\u00e9letes megold\u00e1s lehet a fenti k\u00e9pen bemutatott megold\u00e1s. Enn\u00e9l a leny\u00edl\u00f3 men\u00fcn\u00e9l csak a m\u00e1sodik szintig bontjuk ki a kateg\u00f3riaf\u00e1t, ahol minden link egyenrang\u00fa a megjelen\u00edt\u00e9sben.<\/p>\n\n\n\n<p>Ilyen fajta leny\u00edl\u00f3 l\u00e9trehoz\u00e1sa viszonylag egyszer\u0171, k\u00f3dol\u00e1si szempontb\u00f3l, viszont a h\u00e1tteret (fenti k\u00e9p eset\u00e9n a sz\u00edn\u00e1tmenetet) k\u00fcl\u00f6n el\u0151 kell \u00e1ll\u00edtani hozz\u00e1.<\/p>\n\n\n\n<p><strong>2. Az egyes f\u0151kateg\u00f3ri\u00e1kon bel\u00fcli alkateg\u00f3ri\u00e1kat is fontos megjelen\u00edteni a web\u00e1ruh\u00e1zban<\/strong><\/p>\n\n\n\n<p>Ha szeretn\u00e9nk megjelen\u00edteni a harmadik kateg\u00f3ria szintet is, akkor a k\u00f6vetkez\u0151 p\u00e9lda lehet egy j\u00f3 megold\u00e1s:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1383\" height=\"714\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu2.png\" alt=\"\" class=\"wp-image-16043\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu2.png 1383w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu2-1024x529.png 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu2-768x396.png 768w\" sizes=\"(max-width: 1383px) 100vw, 1383px\" \/><\/figure>\n\n\n\n<p>A legt\u00f6bb leny\u00edl\u00f3 men\u00fc ezt a strukt\u00far\u00e1t k\u00f6veti, oszlopokba rendezett alkateg\u00f3ri\u00e1kkal. \u00cdgy \u00e1tl\u00e1that\u00f3 szinte a teljes kateg\u00f3riafa, aminek az eredm\u00e9nyek\u00e9nt a l\u00e1togat\u00f3 el\u00e9 t\u00e1rul a web\u00e1ruh\u00e1z teljes k\u00edn\u00e1lata.<\/p>\n\n\n\n<p><strong>3. Kev\u00e9s a web\u00e1ruh\u00e1z kateg\u00f3ri\u00e1ja, de fontos ezek vizu\u00e1lis megjelen\u00edt\u00e9se<\/strong><\/p>\n\n\n\n<p>Ha kev\u00e9s alkateg\u00f3ri\u00e1nk van, akkor k\u00e9pekkel is dolgozhatunk, amely vizu\u00e1lisan is seg\u00edti a l\u00e1togat\u00f3t a t\u00e1j\u00e9koz\u00f3d\u00e1sban.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1361\" height=\"385\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu3.png\" alt=\"\" class=\"wp-image-16044\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu3.png 1361w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu3-1024x290.png 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu3-768x217.png 768w\" sizes=\"(max-width: 1361px) 100vw, 1361px\" \/><\/figure>\n\n\n\n<p><strong>4. Dinamikus megjelen\u00e9s gyakran v\u00e1ltoz\u00f3 kateg\u00f3ri\u00e1k eset\u00e9n<\/strong><\/p>\n\n\n\n<p>Abban az esetben, ha fontos az, hogy dinamikus maradjon a leny\u00edl\u00f3 men\u00fc, mert gyakran v\u00e1ltoznak a kateg\u00f3ri\u00e1k, <strong>akkor a gy\u00e1ri leny\u00edl\u00f3 \u00e1talak\u00edt\u00e1sa lehet megold\u00e1s a sz\u00e1munkra<\/strong>, mert az automatikusan v\u00e1ltozik, ha egy alkateg\u00f3ri\u00e1t \u00e1tnevez\u00fcnk. \u00cdgy tudunk \u00e9rt\u00e9kes adminisztr\u00e1ci\u00f3s id\u0151t sp\u00f3rolni.<\/p>\n\n\n\n<p>A gy\u00e1ri leny\u00edl\u00f3 men\u00fc dinamikusan tud v\u00e1ltozni. Ha t\u00f6rl\u00fcnk vagy \u00e1tnevez\u00fcnk egy alkateg\u00f3ri\u00e1t, akkor az a men\u00fcben is m\u00f3dosul. Azonban itt egy <strong>adott HTML strukt\u00far\u00e1val<\/strong> dolgozunk, \u00edgy akkora mozg\u00e1ster\u00fcnk, mint a fenti esetekben \u00e9s <strong>magasabb CSS tud\u00e1st ig\u00e9nyel a megval\u00f3s\u00edt\u00e1s<\/strong>. Ennek hi\u00e1ny\u00e1ban javasolt ink\u00e1bb szak\u00e9rt\u0151kh\u00f6z fordulni, melyre a <a rel=\"noreferrer noopener\" href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles?utm_medium=other&amp;utm_source=srblog&amp;utm_campaign=egyedi-lenyilo-menu-a-shoprenterben_srblog_other\" target=\"_blank\">webshop kin\u00e9zet m\u00f3dos\u00edt\u00e1s<\/a> szolg\u00e1ltat\u00e1sunk keret\u00e9ben lehet\u0151s\u00e9get is biztos\u00edtunk \u00fcgyfeleinknek.<\/p>\n\n\n\n<p>Ebben az esetben a kiindul\u00f3 \u00e1llapotunk:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"863\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu4.jpg\" alt=\"\" class=\"wp-image-16045\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu4.jpg 1600w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu4-1024x552.jpg 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu4-768x414.jpg 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu4-1536x828.jpg 1536w\" sizes=\"(max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n\n\n\n<p>Megfelel\u0151 CSS tud\u00e1s seg\u00edts\u00e9g\u00e9vel alak\u00edthatjuk egy \u00e1ttekinthet\u0151bb leny\u00edl\u00f3v\u00e1:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1169\" height=\"361\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu5.png\" alt=\"\" class=\"wp-image-16046\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu5.png 1169w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu5-1024x316.png 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu5-768x237.png 768w\" sizes=\"(max-width: 1169px) 100vw, 1169px\" \/><\/figure>\n\n\n\n<p>Most hogy m\u00e1r sorra vett\u00fck a leny\u00edl\u00f3 men\u00fck lehet\u0151s\u00e9geit, n\u00e9zz\u00fck meg, hogy hogyan tudod Te is kialak\u00edtani web\u00e1ruh\u00e1zadban!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00cdgy k\u00e9sz\u00edts egyedi leny\u00edl\u00f3 men\u00fct Shoprenterben<\/h2>\n\n\n\n<p>N\u00e9zz\u00fck meg, hogyan tudunk l\u00e9trehozni egy egyszer\u0171bb egyedi leny\u00edl\u00f3t a rendszerben. Ez k\u00e9t modulban tud megjelenni:<\/p>\n\n\n\n<ul><li>F\u0151 kateg\u00f3ria men\u00fc, amivel ebben a cikkben foglalkozunk<\/li><li>\u201cKateg\u00f3ria men\u00fc 2\u201d modul (Megjelen\u00e9s &gt; Modulok men\u00fcpontban).<\/li><\/ul>\n\n\n\n<p>Kiv\u00e1lasztott t\u00e9m\u00e1t\u00f3l f\u00fcgg\u0151en besz\u00e9l\u00fcnk leg\u00f6rd\u00fcl\u0151 vagy kig\u00f6rd\u00fcl\u0151 men\u00fcr\u0151l. A Los Angeles t\u00e9ma az egyetlen, ahol vertik\u00e1lisan elhelyezked\u0151 men\u00fcvel tal\u00e1lkozunk, ott kis m\u00f3dos\u00edt\u00e1st ig\u00e9nyel a p\u00e9lda.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Egyedi leny\u00edl\u00f3 men\u00fc megval\u00f3s\u00edt\u00e1sa a f\u0151 kateg\u00f3ria men\u00fcben<\/h3>\n\n\n\n<p><strong>Javasoljuk, hogy a tesztel\u00e9s, k\u00eds\u00e9rletez\u00e9s ideje alatt egy lefriss\u00edtett <a rel=\"noreferrer noopener\" href=\"https:\/\/support.shoprenter.hu\/hc\/hu\/articles\/360006521438-Sandbox-rendszer\" target=\"_blank\">sandboxban<\/a> dolgozz, ne az \u00e9les \u00e1ruh\u00e1zon.<\/strong><\/p>\n\n\n\n<p>A Term\u00e9kek &gt; Kateg\u00f3ri\u00e1k men\u00fcben a k\u00edv\u00e1nt kateg\u00f3ria szerkeszt\u00e9s\u00e9n\u00e9l, a Leny\u00edl\u00f3 tartalom f\u00fcl alatt elkezdj\u00fck a munk\u00e1t. Itt tal\u00e1lunk a fenti r\u00e9szen be\u00e1ll\u00edt\u00e1sokat \u00e9s lent egy HTML szerkeszt\u0151 modult, ahol&nbsp; HTML \u00e9s CSS k\u00f3dok seg\u00edts\u00e9g\u00e9vel tudjuk megval\u00f3s\u00edtani az egyedi leny\u00edl\u00f3 men\u00fc m\u0171k\u00f6d\u00e9s\u00e9t \u00e9s kin\u00e9zet\u00e9t.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1563\" height=\"1141\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/kategoria-lenyilo.jpg\" alt=\"\" class=\"wp-image-16047\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/kategoria-lenyilo.jpg 1563w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/kategoria-lenyilo-1024x748.jpg 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/kategoria-lenyilo-768x561.jpg 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/kategoria-lenyilo-1536x1121.jpg 1536w\" sizes=\"(max-width: 1563px) 100vw, 1563px\" \/><\/figure>\n\n\n\n<p>Az Egyedi leg\u00f6rd\u00fcl\u0151 men\u00fcn\u00e9l v\u00e1lasszuk a &#8222;Horizont\u00e1lis fel\u00fcl&#8221; opci\u00f3t, az Elrendez\u00e9s opci\u00f3n\u00e1l pedig a &#8222;Teljesen balra z\u00e1rt&#8221; lehet\u0151s\u00e9get.&nbsp;<\/p>\n\n\n\n<p>A munka neheze most k\u00f6vetkezik. A HTML szerkeszt\u0151ben nyitunk egy \u00faj div-et, ami kap egy egyedi azonos\u00edt\u00f3t. Ez fogja tartalmazni az \u00f6sszes HTML k\u00f3dot, illetve style elemek k\u00f6z\u00f6tt adhatjuk meg a CSS utas\u00edt\u00e1sokat.<\/p>\n\n\n\n<p>Minden kateg\u00f3ri\u00e1nak van egy egyedi azonos\u00edt\u00f3ja, ami egy listaelem, ebben tal\u00e1ljuk meg a f\u0151kateg\u00f3ria linkj\u00e9t, \u00e9s a leny\u00edl\u00f3t tartalmaz\u00f3 div elemet. Erre a div elemre ha tesz\u00fcnk CSS-b\u0151l egy <em>display:block !important<\/em> utas\u00edt\u00e1st, k\u00f6nnyebben tudunk dolgozni.<\/p>\n\n\n\n<p>A tartalmat \u00fagy c\u00e9lszer\u0171 fel\u00e9p\u00edteni, hogy a fent eml\u00edtett egyedi azonos\u00edt\u00f3val rendelkez\u0151 div-ben l\u00e9trehozunk annyi div-et, ah\u00e1ny oszlopot szeretn\u00e9nk, majd ezeket a div-eket felt\u00f6ltj\u00fck linkekkel, amik az alkateg\u00f3ri\u00e1kat tartalmazz\u00e1k. Ehhez haszn\u00e1lhatunk egy rendezett list\u00e1t, aminek a form\u00e1z\u00e1s\u00e1t k\u00e9s\u0151bb elt\u00e1vol\u00edtjuk.<\/p>\n\n\n\n<p>A men\u00fc form\u00e1z\u00e1s\u00e1hoz CSS-t kell haszn\u00e1lnunk. El\u0151sz\u00f6r hat\u00e1rozzuk meg a men\u00fc m\u00e9ret\u00e9t, melyhez k\u00e9t elemet kell form\u00e1zni:&nbsp;<\/p>\n\n\n\n<pre class=\"wp-block-verse\">#cat_179 .subtree-dropdown {\n&nbsp;&nbsp; width: 1100px !important;\n&nbsp;&nbsp; height:300px !important;\n}<\/pre>\n\n\n\n<p>Ha a h\u00e1tt\u00e9rsz\u00ednt szeretn\u00e9nk v\u00e1ltoztatni, akkor a fenti elemnek (#cat_179 .subtree-dropdown) kell megadni a h\u00e1tteret, amit \u00fagy tehet\u00fcnk meg, hogy kieg\u00e9sz\u00edtj\u00fck a <em>background-color:#efefef;<\/em> utas\u00edt\u00e1ssal a k\u00f3dot.<\/p>\n\n\n\n<pre class=\"wp-block-verse\">#cat_179 .subtree-dropdown-inner {\nwidth: 100% !important;\nheight: 100% !important;\n}<\/pre>\n\n\n\n<p>Ezekn\u00e9l az elemekn\u00e9l az egyedi azonos\u00edt\u00f3t a saj\u00e1t kateg\u00f3ria azonos\u00edt\u00f3ra kell cser\u00e9lni. Azt javaslom, hogy minden CSS-n\u00e9l ezekb\u0151l az elemekb\u0151l induljunk ki, hogy elker\u00fclj\u00fck az esetleges mell\u00e9khat\u00e1sokat.<\/p>\n\n\n\n<p>Mivel a Shoprenter t\u00e9m\u00e1i alapb\u00f3l haszn\u00e1lnak <strong>Bootstrap<\/strong>-et, \u00edgy kicsit k\u00f6nnyebb dolgunk van. Az egyedi azonos\u00edt\u00f3val ell\u00e1tott div-re tesz\u00fcnk egy <strong>class=&#8221;row&#8221;<\/strong> attrib\u00fatumot, m\u00edg azokra a divekre, amiket oszlopnak sz\u00e1ntunk, egy <strong>class=&#8221;col&#8221;<\/strong>-t.&nbsp;<\/p>\n\n\n\n<p>\u00cdgy m\u00e1r oszlop szer\u0171en jelennek meg a linkjeink, azonban itt m\u00e9g teljes sz\u00e9less\u00e9get vesznek fel az oszlopon bel\u00fcl, ez\u00e9rt az \u00f6sszes linknek a leny\u00edl\u00f3n bel\u00fcl kapnia kell egy <em>display: inline;<\/em> parancsot.<\/p>\n\n\n\n<p><strong>A m\u00e9retez\u00e9sn\u00e9l figyelni kell a kisebb kijelz\u0151n val\u00f3 megjelen\u00e9sre is, hiszen ma m\u00e1r elengedhetetlen a reszponzivit\u00e1s. <\/strong>Ezek a leny\u00edl\u00f3 men\u00fck 992px sz\u00e9les kijelz\u0151ig jelennek meg. <\/p>\n\n\n\n<p>A p\u00e9ld\u00e1ban 1100px sz\u00e9les a leny\u00edl\u00f3, \u00edgy az 1150 pixel alatti m\u00e9retek eset\u00e9n le kell cs\u00f6kkenten\u00fcnk a sz\u00e9less\u00e9g\u00e9t 900px-re. Ha sok a tartalom a bet\u0171m\u00e9ret cs\u00f6kkent\u00e9s\u00e9vel, a sork\u00f6z\u00f6k cs\u00f6kkent\u00e9s\u00e9vel, illetve bizonyos tartalmak elt\u00e1vol\u00edt\u00e1s\u00e1val tudunk optimaliz\u00e1lni a megjelen\u00e9sen.<\/p>\n\n\n\n<p>Ha eddig mindent megcsin\u00e1ltunk, kis sz\u00ednez\u00e9s ut\u00e1n, ezt az eredm\u00e9nyt kell kapnunk \u00e9s ezennel el is k\u00e9sz\u00fclt\u00fcnk az egyedi leny\u00edl\u00f3 men\u00fcvel:&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1185\" height=\"418\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu6.png\" alt=\"\" class=\"wp-image-16048\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu6.png 1185w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu6-1024x361.png 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/menu6-768x271.png 768w\" sizes=\"(max-width: 1185px) 100vw, 1185px\" \/><\/figure>\n\n\n\n<p>Rem\u00e9lj\u00fck, hogy \u00fatmutat\u00f3nk seg\u00edts\u00e9g\u00e9vel Te is optimaliz\u00e1lni tudod web\u00e1ruh\u00e1zad men\u00fcj\u00e9nek \u00e1tl\u00e1that\u00f3s\u00e1g\u00e1t, ami jelent\u0151sen hozz\u00e1j\u00e1rul majd a felhaszn\u00e1l\u00f3i \u00e9lm\u00e9nyhez \u00e9s ez\u00e1ltal web\u00e1ruh\u00e1zad konverzi\u00f3j\u00e1hoz is.<\/p>\n\n\n\n<p>Ha azonban elakadt\u00e1l \u00e9s az \u00e9rt\u00e9kes id\u0151det ink\u00e1bb a web\u00e1ruh\u00e1zad n\u00f6veked\u00e9s\u00e9re ford\u00edtan\u00e1d, <strong>b\u00edzd a k\u00f3dos munk\u00e1t a Shoprenter fejleszt\u0151kre, akik a <a rel=\"noreferrer noopener\" href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles?utm_medium=other&amp;utm_source=srblog&amp;utm_campaign=egyedi-lenyilo-menu-a-shoprenterben_srblog_other\" target=\"_blank\">frontend fejleszt\u0151 napok<\/a> keret\u00e9ben megval\u00f3s\u00edtj\u00e1k egyedi ig\u00e9nyeidet.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles?utm_medium=other&amp;utm_source=srblog&amp;utm_campaign=egyedi-lenyilo-menu-a-shoprenterben_srblog_other\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"200\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/jb-kinezet2.png\" alt=\"\" class=\"wp-image-16660\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/jb-kinezet2.png 840w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/jb-kinezet2-768x183.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure>\n\n\n\n<h3>A szerz\u0151r\u0151l:<\/h3>\n<div class=\"sr-author\">\n<div class=\"sr-author-img\"><img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2023\/01\/bencedavid-1.jpg\" alt=\"D\u00e1vid Bence\"><\/div>\n<div class=\"sr-author-desc\"><span class=\"sr-author-name\">D\u00e1vid Bence<\/span><br><span class=\"sr-author-pos\">Sitebuilder &#8211; <\/span><a href=\"https:\/\/www.shoprenter.hu\/\" target=\"_blank\" rel=\"noopener noreferrer\"> Shoprenter<\/a><br>Bence a Shoprenter egyedi diz\u00e1jn csapat\u00e1nak tagja. A web\u00e1ruh\u00e1zak egyedi diz\u00e1jn fejleszt\u00e9s\u00e9vel foglalkozik \u00e9s fejleszt\u0151i napokon seg\u00edt az \u00fcgyfeleink egyedi ig\u00e9nyeinek megval\u00f3s\u00edt\u00e1s\u00e1ban. <a href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles\"> K\u00e9rj Te is seg\u00edts\u00e9get boltod \u00e1talak\u00edt\u00e1s\u00e1hoz!<\/a>\n <\/div>\n<div>&nbsp;<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Mit kell tudni az egyedi leny\u00edl\u00f3 men\u00fcr\u0151l? Az egyedi leny\u00edl\u00f3 men\u00fc alatt egy olyan &#8230;<\/p>\n<p class=\"read-more-link\"><a class=\"btn btn-outline-primary btn-xs understrap-read-more-link\" href=\"https:\/\/www.shoprenter.hu\/blog\/egyedi-lenyilo-menu-a-shoprenterben\">Elolvasom<\/a><\/p>\n","protected":false},"author":91,"featured_media":16057,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[],"_links":{"self":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/16040"}],"collection":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/users\/91"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/comments?post=16040"}],"version-history":[{"count":15,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/16040\/revisions"}],"predecessor-version":[{"id":16661,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/16040\/revisions\/16661"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/media\/16057"}],"wp:attachment":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/media?parent=16040"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/categories?post=16040"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/tags?post=16040"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}