{"id":1607,"date":"2025-10-10T12:35:00","date_gmt":"2025-10-10T12:35:00","guid":{"rendered":"https:\/\/xudev.io\/?p=1607"},"modified":"2025-11-01T11:34:18","modified_gmt":"2025-11-01T11:34:18","slug":"lepi-d-o-o-webshop","status":"publish","type":"post","link":"https:\/\/xudev.io\/en\/lepi-d-o-o-webshop\/","title":{"rendered":""},"content":{"rendered":"<!-- XUDEV \u2022 Case Study (Full Premium \u2014 perfect align, glass 2px, charts 2-row layout) -->\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@400;600;700;800&#038;display=swap\" rel=\"stylesheet\">\n\n<section class=\"xcs\" aria-labelledby=\"xcs-title\">\n  <div class=\"xcs-wrap\">\n\n    <!-- Header -->\n    <header class=\"xcs-head\">\n      <div class=\"xcs-eyebrow\">Case Study<\/div>\n      <h1 id=\"xcs-title\" class=\"xcs-title\">Lepi.ba \u2014 e-commerce za Lepi d.o.o. Konjic<\/h1>\n      <p class=\"xcs-sub\">Digitalna transformacija prodaje elektro, rasvjetnog i gra\u0111evinskog materijala<\/p>\n    <\/header>\n\n    <!-- HERO (glass frame) -->\n    <figure class=\"xcs-hero xcs-reveal\" aria-label=\"Prikaz Lepi.ba webshopa\">\n      <img\n        src=\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/04\/Screenshot-2025-04-30-141112.png\"\n        alt=\"Lepi.ba \u2014 prikaz po\u010detne stranice web shopa\"\n        loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"900\"\n      \/>\n      <figcaption class=\"xcs-hero-cap\">Izgled po\u010detne stranice web shopa Lepi.ba<\/figcaption>\n    <\/figure>\n\n    <!-- Uvod -->\n    <article class=\"xcs-card xcs-reveal\">\n      <p>\n        <strong>Lepi.ba<\/strong> je web shop kompanije <strong>Lepi d.o.o. Konjic<\/strong>. Cilj je bio kreirati modernu, brzu i pouzdanu\n        e-commerce platformu koja omogu\u0107ava jednostavnu online kupovinu, potpun pregled asortimana i lak kontakt s kupcima \u0161irom BiH.\n      <\/p>\n    <\/article>\n\n    <!-- Izazovi \/ Rje\u0161enje -->\n    <div class=\"xcs-grid\">\n      <article class=\"xcs-card xcs-reveal\">\n        <h2 class=\"xcs-h2\">Challenges<\/h2>\n        <p>Prije digitalizacije, prodaja se odvijala klasi\u010dnim putem. Klju\u010dni zadaci:<\/p>\n        <ul class=\"xcs-list\">\n          <li>Digitalizacija prodaje i procesa<\/li>\n          <li>Pregledna kategorizacija proizvoda<\/li>\n          <li>Brz i jednostavan sistem naru\u010divanja<\/li>\n        <\/ul>\n      <\/article>\n\n      <article class=\"xcs-card xcs-reveal\">\n        <h2 class=\"xcs-h2\">Na\u0161e rje\u0161enje<\/h2>\n        <p>\n          Prilago\u0111en web shop na <strong>WordPress + WooCommerce<\/strong> sa fokusom na UX, performanse i sigurnost.\n          Implementirane su optimizacija slika, SEO najbolja praksa i automatizovano upravljanje zalihama.\n        <\/p>\n      <\/article>\n    <\/div>\n\n    <!-- Klju\u010dne funkcionalnosti -->\n    <section class=\"xcs-card xcs-reveal\">\n      <h2 class=\"xcs-h2\">Klju\u010dne funkcionalnosti<\/h2>\n      <div class=\"xcs-feats\">\n        <div class=\"xcs-feat\"><h3>Online katalog<\/h3><p>Stotine artikala, jasno kategorizirano i brzo za pregled.<\/p><\/div>\n        <div class=\"xcs-feat\"><h3>Pra\u0107enje narud\u017ebi<\/h3><p>Statusi isporuke i e-mail notifikacije u realnom vremenu.<\/p><\/div>\n        <div class=\"xcs-feat\"><h3>Responzivan dizajn<\/h3><p>Besprijekoran prikaz na desktopu i mobilnim ure\u0111ajima.<\/p><\/div>\n        <div class=\"xcs-feat\"><h3>Napredna pretraga<\/h3><p>Filtri po cijeni, kategoriji, brendu i dostupnosti.<\/p><\/div>\n        <div class=\"xcs-feat\"><h3>SEO optimizacija<\/h3><p>Brza u\u010ditavanja, \u010dista struktura i bolje Google pozicije.<\/p><\/div>\n        <div class=\"xcs-feat\"><h3>Automatske fakture<\/h3><p>Automatsko fakturisanje i uredna evidencija narud\u017ebi.<\/p><\/div>\n      <\/div>\n    <\/section>\n\n    <!-- Tehnologije \/ KPI -->\n    <div class=\"xcs-grid\">\n      <article class=\"xcs-card xcs-reveal\">\n        <h2 class=\"xcs-h2\">Kori\u0161tene tehnologije<\/h2>\n        <ul class=\"xcs-tech\">\n          <li><strong>Platform:<\/strong> WordPress + WooCommerce<\/li>\n          <li><strong>Frontend:<\/strong> HTML5, CSS3, JavaScript (jQuery)<\/li>\n          <li><strong>Backend:<\/strong> PHP (WooCommerce API)<\/li>\n          <li><strong>Integrations:<\/strong> PayPal, Monri, Mail SMTP<\/li>\n          <li><strong>Hosting:<\/strong> XUDEV Cloud Hosting<\/li>\n        <\/ul>\n      <\/article>\n\n      <article class=\"xcs-card xcs-reveal\">\n        <h2 class=\"xcs-h2\">KPI Highlights<\/h2>\n        <div class=\"xcs-kpis\">\n          <div class=\"xcs-kpi\">\n            <div class=\"ring\" style=\"--val:82\"><span>82%<\/span><\/div>\n            <p>br\u017ee u\u010ditavanje<\/p>\n          <\/div>\n          <div class=\"xcs-kpi\">\n            <div class=\"ring\" style=\"--val:230\"><span>230%<\/span><\/div>\n            <p>rast narud\u017ebi (6m)<\/p>\n          <\/div>\n          <div class=\"xcs-kpi\">\n            <div class=\"ring\" style=\"--val:180\"><span>180%<\/span><\/div>\n            <p>organski rast posjeta<\/p>\n          <\/div>\n        <\/div>\n      <\/article>\n    <\/div>\n\n    <!-- Rezultati i uticaj (2-row charts layout) -->\n    <section class=\"xcs-card xcs-reveal\">\n      <h2 class=\"xcs-h2\">Results<\/h2>\n      <p>\n        Nakon lansiranja Lepi.ba, online narud\u017ebe i upiti su zna\u010dajno porasli. Poslovanje je digitalizovano,\n        prodaja pokriva cijelu BiH, a brend je dobio sna\u017eniju tr\u017ei\u0161nu prepoznatljivost.\n      <\/p>\n\n      <div class=\"xcs-charts xcs-charts--grid\">\n        <!-- Bars (top-left) -->\n        <div class=\"xcs-chart xcs-chart--bars xcs-span-4\">\n          <h4>Rast narud\u017ebi<\/h4>\n          <div class=\"bar w-58\"><\/div>\n          <div class=\"bar w-78 d1\"><\/div>\n          <div class=\"bar w-100 d2\"><\/div>\n          <small class=\"xcs-note\">+230% u 6 mjeseci<\/small>\n        <\/div>\n\n        <!-- Line (right, spans 2 rows) -->\n        <div class=\"xcs-chart xcs-chart--line xcs-span-8 xcs-row-2\">\n          <h4>Organski trend<\/h4>\n          <svg viewbox=\"0 0 260 120\" class=\"line\" role=\"img\" aria-label=\"Linijski graf\">\n            <path class=\"grid\" d=\"M12 96H248 M12 72H248 M12 48H248 M12 24H248\"\/>\n            <path class=\"area\" d=\"M12,100 L40,94 L80,86 L120,68 L160,54 L200,40 L248,28 L248,100 Z\"\/>\n            <path class=\"trace\" d=\"M12,100 L40,94 L80,86 L120,68 L160,54 L200,40 L248,28\"\/>\n            <line x1=\"12\" y1=\"100\" x2=\"248\" y2=\"100\" class=\"axis\"\/>\n          <\/svg>\n          <small class=\"xcs-note\">SEO kanali u kontinuiranom rastu<\/small>\n        <\/div>\n\n        <!-- Donut (bottom-left) -->\n        <div class=\"xcs-chart xcs-chart--donut xcs-span-4\">\n          <h4>Core Web Vitals<\/h4>\n          <div class=\"donut\" style=\"--pct:82\"><b>82%<\/b><\/div>\n          <small class=\"xcs-note\">performanse sajta<\/small>\n        <\/div>\n      <\/div>\n    <\/section>\n\n    <!-- Zaklju\u010dak -->\n    <article class=\"xcs-card xcs-reveal\">\n      <h2 class=\"xcs-h2\">Zaklju\u010dak<\/h2>\n      <p>\n        Lepi.ba potvr\u0111uje kako tradicionalne trgovine mogu ostvariti mjerljiv rast kroz digitalnu prodaju.\n        XUDEV je isporu\u010dio end-to-end e-commerce rje\u0161enje koje spaja funkcionalnost, moderan dizajn i poslovnu efikasnost.\n      <\/p>\n    <\/article>\n\n    <!-- (CTA blok uklonjen na tvoj zahtjev) -->\n\n  <\/div>\n<\/section>\n\n<style>\n\/* THEME *\/\n.xcs{\n  --glass: rgba(20,27,32,.65);\n  --glass-2: rgba(20,27,32,.78);\n  --border: rgba(255,255,255,.07);\n  --text: #E8EEF3;\n  --muted:#9FB2BF;\n  --accent:#6CABC3;\n  --cta:#005ED5;\n  font-family:\"Montserrat\",ui-sans-serif,system-ui,-apple-system,\"Segoe UI\",Roboto,Arial;\n  color:var(--text);\n}\n.xcs-wrap{max-width:1120px;margin:0 auto;padding:56px 20px;position:relative}\n.xcs::before{\n  content:\"\";position:absolute;inset:0;pointer-events:none;\n  background-image:\n    linear-gradient(to right, rgba(108,171,195,.05) 1px, transparent 1px),\n    linear-gradient(to bottom, rgba(108,171,195,.05) 1px, transparent 1px);\n  background-size:28px 28px;opacity:.6;\n}\n\n\/* HEAD *\/\n.xcs-head{text-align:center;margin-bottom:28px}\n.xcs-eyebrow{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--muted);font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase}\n.xcs-title{margin:10px 0 6px;font-weight:800;font-size:clamp(26px,4vw,40px);color:var(--accent);text-shadow:0 0 16px rgba(108,171,195,.35)}\n.xcs-sub{color:var(--muted);font-size:16px}\n\n\/* GLASS PRIMITIVE *\/\n.xcs-card,.xcs-hero,.xcs-feat,.xcs-chart{\n  position:relative;background:linear-gradient(180deg,var(--glass-2),var(--glass));\n  border:1px solid var(--border);border-radius:16px;\n  box-shadow:0 10px 28px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.03);\n  backdrop-filter:blur(2px);\n}\n.xcs-card::after,.xcs-hero::after,.xcs-feat::after,.xcs-chart::after{\n  content:\"\";position:absolute;inset:0;border-radius:inherit;pointer-events:none;\n  background:linear-gradient(145deg, rgba(255,255,255,.06), transparent 35%);mix-blend-mode:screen\n}\n\n\/* HERO *\/\n.xcs-hero{margin:12px 0 18px;padding:10px}\n.xcs-hero img{width:100%;height:auto;display:block;border-radius:10px;aspect-ratio:16\/9;object-fit:cover;box-shadow:0 0 22px rgba(0,94,213,.35)}\n.xcs-hero-cap{text-align:center;color:var(--muted);font-size:12.5px;margin-top:6px}\n\n\/* CARDS *\/\n.xcs-card{padding:24px}\n.xcs-card > *:first-child{margin-top:0}\n.xcs-card > *:last-child{margin-bottom:0}\n.xcs-h2{font-size:22px;margin:0 0 10px;color:var(--accent);border-left:3px solid var(--accent);padding-left:10px}\n.xcs-card p{line-height:1.75;color:#d5e0e6}\n\n\/* GRID (two columns) *\/\n.xcs-grid{display:grid;gap:16px;grid-template-columns:repeat(12,1fr);margin:16px 0;align-items:start}\n.xcs-grid>.xcs-card{grid-column:span 6;margin-top:0!important;height:100%;display:flex;flex-direction:column}\n@media (max-width:900px){.xcs-grid{grid-template-columns:1fr}.xcs-grid>.xcs-card{grid-column:1\/-1}}\n\n\/* FEATURES *\/\n.xcs-list{list-style:none;padding-left:0;margin:10px 0 0}\n.xcs-list li{position:relative;padding-left:18px;margin:6px 0;color:#d3dde3}\n.xcs-list li::before{content:\"\";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,var(--accent),transparent 70%);box-shadow:0 0 10px rgba(108,171,195,.5)}\n.xcs-feats{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:8px}\n.xcs-feat{padding:16px;transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease}\n.xcs-feat h3{margin:0 0 6px;font-size:15.5px;color:var(--accent);font-weight:700}\n.xcs-feat p{margin:0;color:#c9d7de;font-size:14.5px}\n.xcs-feat:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.1);box-shadow:0 14px 30px rgba(108,171,195,.22)}\n\n\/* KPI RINGS *\/\n.xcs-kpis{display:flex;gap:16px;flex-wrap:wrap}\n.xcs-kpi{text-align:center;flex:1 1 120px;min-width:120px}\n.ring{--size:96px;width:var(--size);height:var(--size);border-radius:50%;display:grid;place-items:center;margin:0 auto 6px;background:\n  radial-gradient(circle at 50% 50%, rgba(0,0,0,.25), transparent 60%),\n  conic-gradient(var(--cta) calc(var(--val) * 1deg), rgba(255,255,255,.10) 0);\n  box-shadow: inset 0 0 0 10px rgba(20,27,32,.92), 0 0 16px rgba(0,94,213,.35);animation:ringPop .9s ease both}\n.ring span{font-weight:800;color:#fff;text-shadow:0 0 10px rgba(0,94,213,.45)}\n.xcs-kpi p{margin:0;color:var(--muted);font-size:13px}\n\n\/* CHARTS LAYOUT (2-rows: left stack, right spans 2) *\/\n.xcs-charts--grid{\n  display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:14px;\n  grid-auto-rows:minmax(220px,auto);\n  align-items:stretch;\n}\n.xcs-span-4{grid-column:span 4}\n.xcs-span-8{grid-column:span 8}\n.xcs-row-2{grid-row:span 2}\n@media (max-width:900px){\n  .xcs-span-4,.xcs-span-8{grid-column:1 \/ -1}\n  .xcs-row-2{grid-row:auto}\n}\n\n\/* Chart cards *\/\n.xcs-chart{\n  padding:16px 16px 14px;\n  box-shadow:0 8px 22px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.02);\n  display:flex; flex-direction:column; height:100%;\n}\n.xcs-chart h4{margin:0 0 10px;font-size:18px;letter-spacing:.2px;color:var(--accent)}\n\n\/* Bars *\/\n.xcs-chart--bars .bar{\n  height:12px;border-radius:8px;margin:10px 0;\n  background:linear-gradient(90deg,var(--cta),#2e82ff,var(--cta));\n  background-size:200% 100%;animation:flow 3s linear infinite;\n  box-shadow:0 0 16px rgba(0,94,213,.35)\n}\n\n\/* Line *\/\n.xcs-chart--line{min-height:0}\n.xcs-chart--line .line{width:100%;height:auto;flex:1}\n.xcs-chart--line .grid{stroke:rgba(255,255,255,.06);stroke-width:1;fill:none}\n.xcs-chart--line .axis{stroke:rgba(255,255,255,.08);stroke-width:1}\n.xcs-chart--line .area{fill:rgba(0,94,213,.18);filter:drop-shadow(0 2px 8px rgba(0,94,213,.25));animation:areaPop .9s ease both .15s}\n.xcs-chart--line .trace{\n  stroke:var(--cta);stroke-width:4;fill:none;stroke-linecap:round;stroke-linejoin:round;\n  stroke-dasharray:500;stroke-dashoffset:500;animation:draw 1.2s ease forwards .2s;filter:drop-shadow(0 0 8px rgba(0,94,213,.35))\n}\n\n\/* Donut *\/\n.xcs-chart--donut .donut{\n  --size:122px;--trk:rgba(255,255,255,.10);\n  width:var(--size);height:var(--size);border-radius:50%;display:grid;place-items:center;margin:6px auto 6px;\n  background:radial-gradient(circle at 50% 50%, rgba(0,0,0,.28), transparent 58%),\n             conic-gradient(var(--cta) calc((var(--pct)\/100) * 360deg), var(--trk) 0);\n  box-shadow:inset 0 0 0 14px rgba(20,27,32,.94), 0 0 18px rgba(0,94,213,.32)\n}\n.xcs-chart--donut .donut b{font-weight:800;font-size:20px;color:#fff;text-shadow:0 0 10px rgba(0,94,213,.4)}\n\n\/* Motion *\/\n.xcs-reveal{opacity:0;transform:translateY(10px);animation:reveal .7s ease forwards}\n.xcs-reveal + .xcs-reveal{animation-delay:.06s}\n@keyframes reveal{to{opacity:1;transform:translateY(0)}}\n@keyframes flow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}\n@keyframes draw{to{stroke-dashoffset:0}}\n@keyframes areaPop{from{transform:scaleY(.96);opacity:.3}to{transform:scaleY(1);opacity:1}}\n@keyframes donutPop{from{transform:scale(.92);opacity:.2}to{transform:scale(1);opacity:1}}\n@keyframes ringPop{from{transform:scale(.94);opacity:.2}to{transform:scale(1);opacity:1}}\n\n@media (prefers-reduced-motion: reduce){\n  .xcs *{animation:none!important;transition:none!important}\n}\n<\/style>\n\n\n\n\n<!-- XUDEV - Case Study CTA \/ Visit Website -->\n<section class=\"cs-cta\" aria-labelledby=\"cs-cta-title\">\n  <div class=\"cs-cta__wrap\">\n    <div class=\"cs-cta__badge\">LEPI d.o.o.<\/div>\n\n    <h3 id=\"cs-cta-title\" class=\"cs-cta__title\">\n      Pogledaj projekat u\u017eivo\n    <\/h3>\n\n    <p class=\"cs-cta__desc\">\n      Posjeti zvani\u010dnu web stranicu <strong>LEPI d.o.o.<\/strong> i vidi kako spoj modernog dizajna i funkcionalnosti izgleda u stvarnom okru\u017eenju.\n    <\/p>\n\n    <a href=\"https:\/\/www.lepi.ba\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"cs-cta__btn\">\n      Posjeti lepi.ba\n      <svg class=\"cs-cta__icon\" viewbox=\"0 0 24 24\" width=\"20\" height=\"20\" aria-hidden=\"true\">\n        <path d=\"M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3z\"><\/path>\n        <path d=\"M5 5h6V3H3v8h2V5z\"><\/path>\n      <\/svg>\n    <\/a>\n\n    <div class=\"cs-cta__meta\">\n      Live demo \u2022 www.lepi.ba\n    <\/div>\n  <\/div>\n\n  <span class=\"cs-cta__blob cs-cta__blob--one\"><\/span>\n  <span class=\"cs-cta__blob cs-cta__blob--two\"><\/span>\n<\/section>\n\n<style>\n  .cs-cta {\n    --bg: #131A20;\n    --border: #1E2A32;\n    --accent: #6CABC3;\n    --glow: #005ED5;\n    --text: #E6EEF2;\n    --muted: #9fb6c1;\n    position: relative;\n    overflow: hidden;\n    isolation: isolate;\n    border-radius: 18px;\n    padding: 40px 28px;\n    margin: 40px 0;\n    text-align: center;\n    border: 1px solid var(--border);\n\n    background: \n      linear-gradient(rgba(19,26,32,0.85), rgba(19,26,32,0.92)),\n      url(\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/10\/bgc.png\");\n    background-size: cover;\n    background-position: center;\n    box-shadow: 0 8px 25px rgba(0, 0, 0, .4), inset 0 0 0 1px rgba(255,255,255,.04);\n  }\n\n  .cs-cta__badge {\n    display: inline-block;\n    padding: 6px 12px;\n    margin-bottom: 12px;\n    background: rgba(255,255,255,0.08);\n    border-radius: 999px;\n    font: 600 12px\/1.1 system-ui;\n    color: var(--text);\n    letter-spacing: .08em;\n    text-transform: uppercase;\n    backdrop-filter: blur(8px);\n  }\n\n  .cs-cta__title {\n    color: var(--text);\n    font: 800 clamp(22px, 3vw, 30px)\/1.2 'Inter', system-ui;\n    margin: 0 0 10px;\n  }\n\n  .cs-cta__desc {\n    color: var(--muted);\n    font: 500 clamp(14px, 2.2vw, 16px)\/1.6 'Inter', system-ui;\n    max-width: 720px;\n    margin: 0 auto 22px;\n  }\n\n  .cs-cta__btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 22px;\n    border-radius: 12px;\n    text-decoration: none;\n    color: #fff;\n    font: 700 15px\/1 'Inter', system-ui;\n    background: linear-gradient(90deg, var(--glow), #0078ff, var(--glow));\n    background-size: 200% 100%;\n    box-shadow: 0 0 20px rgba(0, 94, 213, 0.4);\n    animation: glowmove 3s linear infinite;\n    transition: transform .25s ease, box-shadow .25s ease;\n  }\n\n  .cs-cta__btn:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 0 25px rgba(0, 94, 213, 0.6);\n  }\n\n  @keyframes glowmove {\n    0% { background-position: 0% 50%; }\n    50% { background-position: 100% 50%; }\n    100% { background-position: 0% 50%; }\n  }\n\n  .cs-cta__icon { fill: #fff }\n  .cs-cta__meta {\n    margin-top: 10px;\n    color: var(--muted);\n    font: 500 12px\/1.6 system-ui;\n  }\n\n  \/* dekorativni blob efekti *\/\n  .cs-cta__blob {\n    position: absolute;\n    border-radius: 50%;\n    filter: blur(40px);\n    opacity: .5;\n    mix-blend-mode: screen;\n    animation: float 9s ease-in-out infinite;\n  }\n\n  .cs-cta__blob--one {\n    width: 220px; height: 220px;\n    right: -70px; bottom: -70px;\n    background: radial-gradient(circle at 30% 30%, var(--accent), var(--glow) 70%, transparent 80%);\n  }\n\n  .cs-cta__blob--two {\n    width: 260px; height: 260px;\n    left: -80px; top: -80px;\n    background: radial-gradient(circle at 30% 30%, #1e2c35, var(--accent) 60%, transparent 70%);\n    animation-delay: -3s;\n  }\n\n  @keyframes float {\n    0%,100% { transform: translateY(0); }\n    50% { transform: translateY(-10px); }\n  }\n\n  @media (max-width:480px) {\n    .cs-cta { padding: 28px; }\n    .cs-cta__btn { width: 100%; justify-content: center; }\n  }\n<\/style>\n\n\n<p class=\"wp-block-paragraph\" style=\"\"><\/p>","protected":false},"excerpt":{"rendered":"<p>Case Study Lepi.ba \u2014 e-commerce za Lepi d.o.o. Konjic Digitalna transformacija prodaje elektro, rasvjetnog i gra\u0111evinskog materijala Izgled po\u010detne stranice web shopa Lepi.ba Lepi.ba je web shop kompanije Lepi d.o.o. Konjic. Cilj je bio kreirati modernu, brzu i pouzdanu e-commerce platformu koja omogu\u0107ava jednostavnu online kupovinu, potpun pregled asortimana i lak kontakt s kupcima \u0161irom &hellip;<\/p>","protected":false},"author":1,"featured_media":1736,"comment_status":"open","ping_status":"open","sticky":false,"template":"full-width","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[23],"tags":[],"class_list":["post-1607","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-website"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala<\/title>\n<meta name=\"description\" content=\"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/xudev.io\/en\/lepi-d-o-o-webshop\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala\" \/>\n<meta property=\"og:description\" content=\"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/xudev.io\/en\/lepi-d-o-o-webshop\/\" \/>\n<meta property=\"og:site_name\" content=\"XUDEV\" \/>\n<meta property=\"article:published_time\" content=\"2025-10-10T12:35:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-01T11:34:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1440\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"xudev\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"xudev\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/\"},\"author\":{\"name\":\"xudev\",\"@id\":\"https:\/\/xudev.io\/#\/schema\/person\/992cba3dd756a475cf5f1e707f7d9812\"},\"headline\":\"No title\",\"datePublished\":\"2025-10-10T12:35:00+00:00\",\"dateModified\":\"2025-11-01T11:34:18+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/\"},\"wordCount\":340,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/xudev.io\/#organization\"},\"image\":{\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg\",\"articleSection\":[\"Website\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/\",\"url\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/\",\"name\":\"LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala\",\"isPartOf\":{\"@id\":\"https:\/\/xudev.io\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg\",\"datePublished\":\"2025-10-10T12:35:00+00:00\",\"dateModified\":\"2025-11-01T11:34:18+00:00\",\"description\":\"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage\",\"url\":\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg\",\"contentUrl\":\"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg\",\"width\":2560,\"height\":1440},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/xudev.io\/#website\",\"url\":\"https:\/\/xudev.io\/\",\"name\":\"XUDEV\",\"description\":\"Va\u0161 pouzdani partner za softverska rje\u0161enja!\",\"publisher\":{\"@id\":\"https:\/\/xudev.io\/#organization\"},\"alternateName\":\"XUDEV.IO\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/xudev.io\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/xudev.io\/#organization\",\"name\":\"XUDEV\",\"url\":\"https:\/\/xudev.io\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/xudev.io\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/xudev.io\/wp-content\/uploads\/2024\/11\/cropped-xuicon2-1.png\",\"contentUrl\":\"https:\/\/xudev.io\/wp-content\/uploads\/2024\/11\/cropped-xuicon2-1.png\",\"width\":256,\"height\":256,\"caption\":\"XUDEV\"},\"image\":{\"@id\":\"https:\/\/xudev.io\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.instagram.com\/xudev.io\/\",\"https:\/\/www.linkedin.com\/company\/xudev\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/xudev.io\/#\/schema\/person\/992cba3dd756a475cf5f1e707f7d9812\",\"name\":\"xudev\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/xudev.io\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0a2f2505ceb374470d4c72d3aa5048370ec214691b880e410225bc205a9d501f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0a2f2505ceb374470d4c72d3aa5048370ec214691b880e410225bc205a9d501f?s=96&d=mm&r=g\",\"caption\":\"xudev\"},\"sameAs\":[\"http:\/\/xudev.io\"],\"url\":\"https:\/\/xudev.io\/en\/author\/xudev\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala","description":"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/xudev.io\/en\/lepi-d-o-o-webshop\/","og_locale":"en_US","og_type":"article","og_title":"LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala","og_description":"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.","og_url":"https:\/\/xudev.io\/en\/lepi-d-o-o-webshop\/","og_site_name":"XUDEV","article_published_time":"2025-10-10T12:35:00+00:00","article_modified_time":"2025-11-01T11:34:18+00:00","og_image":[{"width":2560,"height":1440,"url":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","type":"image\/jpeg"}],"author":"xudev","twitter_card":"summary_large_image","twitter_misc":{"Written by":"xudev","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#article","isPartOf":{"@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/"},"author":{"name":"xudev","@id":"https:\/\/xudev.io\/#\/schema\/person\/992cba3dd756a475cf5f1e707f7d9812"},"headline":"No title","datePublished":"2025-10-10T12:35:00+00:00","dateModified":"2025-11-01T11:34:18+00:00","mainEntityOfPage":{"@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/"},"wordCount":340,"commentCount":0,"publisher":{"@id":"https:\/\/xudev.io\/#organization"},"image":{"@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage"},"thumbnailUrl":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","articleSection":["Website"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/xudev.io\/lepi-d-o-o-webshop\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/","url":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/","name":"LEPI D.O.O. Webshop \u2013 Vodo i Elektro Materijala","isPartOf":{"@id":"https:\/\/xudev.io\/#website"},"primaryImageOfPage":{"@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage"},"image":{"@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage"},"thumbnailUrl":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","datePublished":"2025-10-10T12:35:00+00:00","dateModified":"2025-11-01T11:34:18+00:00","description":"Lepi.ba \u2013 pouzdan webshop za elektro i rasvjetni materijal. Jednostavna online kupovina i brza isporuka \u0161irom Bosne i Hercegovine.","inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/xudev.io\/lepi-d-o-o-webshop\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/xudev.io\/lepi-d-o-o-webshop\/#primaryimage","url":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","contentUrl":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","width":2560,"height":1440},{"@type":"WebSite","@id":"https:\/\/xudev.io\/#website","url":"https:\/\/xudev.io\/","name":"XUDEV","description":"Va\u0161 pouzdani partner za softverska rje\u0161enja!","publisher":{"@id":"https:\/\/xudev.io\/#organization"},"alternateName":"XUDEV.IO","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/xudev.io\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/xudev.io\/#organization","name":"XUDEV","url":"https:\/\/xudev.io\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/xudev.io\/#\/schema\/logo\/image\/","url":"https:\/\/xudev.io\/wp-content\/uploads\/2024\/11\/cropped-xuicon2-1.png","contentUrl":"https:\/\/xudev.io\/wp-content\/uploads\/2024\/11\/cropped-xuicon2-1.png","width":256,"height":256,"caption":"XUDEV"},"image":{"@id":"https:\/\/xudev.io\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.instagram.com\/xudev.io\/","https:\/\/www.linkedin.com\/company\/xudev\/"]},{"@type":"Person","@id":"https:\/\/xudev.io\/#\/schema\/person\/992cba3dd756a475cf5f1e707f7d9812","name":"xudev","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/xudev.io\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0a2f2505ceb374470d4c72d3aa5048370ec214691b880e410225bc205a9d501f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0a2f2505ceb374470d4c72d3aa5048370ec214691b880e410225bc205a9d501f?s=96&d=mm&r=g","caption":"xudev"},"sameAs":["http:\/\/xudev.io"],"url":"https:\/\/xudev.io\/en\/author\/xudev\/"}]}},"jetpack_featured_media_url":"https:\/\/xudev.io\/wp-content\/uploads\/2025\/11\/LEPI-scaled.jpg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/posts\/1607","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/comments?post=1607"}],"version-history":[{"count":31,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/posts\/1607\/revisions"}],"predecessor-version":[{"id":1735,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/posts\/1607\/revisions\/1735"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/media\/1736"}],"wp:attachment":[{"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/media?parent=1607"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/categories?post=1607"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xudev.io\/en\/wp-json\/wp\/v2\/tags?post=1607"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}