CINXE.COM

<!doctype html> <html lang="en-US" prefix="og: https://ogp.me/ns#"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="profile" href="https://gmpg.org/xfn/11"> <link rel="alternate" hreflang="en" href="https://elementor.com/blog/osm-and-elementor/" /> <link rel="alternate" hreflang="x-default" href="https://elementor.com/blog/osm-and-elementor/" />  <title>How A Leading Design Agency Revamped Their Website With Elementor | Elementor</title> <meta name="description" content="Learn how OSM design agency used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look."/> <meta name="robots" content="follow, index, max-snippet:-1, max-video-preview:-1, max-image-preview:large"/> <link rel="canonical" href="https://elementor.com/blog/osm-and-elementor/" /> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="article" /> <meta property="og:title" content="How A Leading Design Agency Revamped Their Website With Elementor | Elementor" /> <meta property="og:description" content="Learn how OSM design agency used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look." /> <meta property="og:url" content="https://elementor.com/blog/osm-and-elementor/" /> <meta property="og:site_name" content="Elementor" /> <meta property="article:publisher" content="https://www.facebook.com/elemntor/" /> <meta property="article:tag" content="Pro" /> <meta property="article:section" content="Case Studies" /> <meta property="og:image" content="https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg" /> <meta property="og:image:secure_url" content="https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta property="og:image:alt" content="How a Leading Design Agency Revamped Their Website With Elementor" /> <meta property="og:image:type" content="image/jpeg" /> <meta property="article:published_time" content="2021-05-26T13:00:05+03:00" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="How A Leading Design Agency Revamped Their Website With Elementor | Elementor" /> <meta name="twitter:description" content="Learn how OSM design agency used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look." /> <meta name="twitter:site" content="@elemntor" /> <meta name="twitter:creator" content="@elemntor" /> <meta name="twitter:image" content="https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg" /> <meta name="twitter:label1" content="Written by" /> <meta name="twitter:data1" content="Ana Karić" /> <meta name="twitter:label2" content="Time to read" /> <meta name="twitter:data2" content="6 minutes" /> <script type="application/ld+json" class="rank-math-schema-pro">{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://elementor.com/blog/#organization","name":"Elementor","url":"http://elementor.com","sameAs":["https://www.facebook.com/elemntor/","https://twitter.com/elemntor","https://www.instagram.com/elementor/","https://www.youtube.com/channel/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1","https://en.wikipedia.org/wiki/Elementor"],"logo":{"@type":"ImageObject","@id":"https://elementor.com/blog/#logo","url":"https://elementor.com/blog/wp-content/uploads/2022/03/elementor-logo.svg","contentUrl":"https://elementor.com/blog/wp-content/uploads/2022/03/elementor-logo.svg","caption":"Elementor","inLanguage":"en-US","width":"163","height":"27"}},{"@type":"WebSite","@id":"https://elementor.com/blog/#website","url":"https://elementor.com/blog","name":"Elementor","alternateName":"Elementor Website Builder","publisher":{"@id":"https://elementor.com/blog/#organization"},"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg","url":"https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg","width":"1200","height":"630","inLanguage":"en-US"},{"@type":"BreadcrumbList","@id":"https://elementor.com/blog/osm-and-elementor/#breadcrumb","itemListElement":[{"@type":"ListItem","position":"1","item":{"@id":"https://elementor.com/","name":"Blog"}},{"@type":"ListItem","position":"2","item":{"@id":"https://elementor.com/blog/category/stories/","name":"Case Studies"}},{"@type":"ListItem","position":"3","item":{"@id":"https://elementor.com/blog/osm-and-elementor/","name":"How a Leading Design Agency Revamped Their Website With Elementor"}}]},{"@type":"WebPage","@id":"https://elementor.com/blog/osm-and-elementor/#webpage","url":"https://elementor.com/blog/osm-and-elementor/","name":"How A Leading Design Agency Revamped Their Website With Elementor | Elementor","datePublished":"2021-05-26T13:00:05+03:00","dateModified":"2021-05-26T13:00:05+03:00","isPartOf":{"@id":"https://elementor.com/blog/#website"},"primaryImageOfPage":{"@id":"https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg"},"inLanguage":"en-US","breadcrumb":{"@id":"https://elementor.com/blog/osm-and-elementor/#breadcrumb"}},{"@type":"Person","@id":"https://elementor.com/blog/author/anakaric/","name":"Ana Kari\u0107","url":"https://elementor.com/blog/author/anakaric/","image":{"@type":"ImageObject","@id":"https://secure.gravatar.com/avatar/ceb5981bb52dd7fd2f4c029f65693b83?s=96&d=mm&r=g","url":"https://secure.gravatar.com/avatar/ceb5981bb52dd7fd2f4c029f65693b83?s=96&d=mm&r=g","caption":"Ana Kari\u0107","inLanguage":"en-US"},"worksFor":{"@id":"https://elementor.com/blog/#organization"}},{"@type":"NewsArticle","headline":"How A Leading Design Agency Revamped Their Website With Elementor | Elementor","datePublished":"2021-05-26T13:00:05+03:00","dateModified":"2021-05-26T13:00:05+03:00","articleSection":"Case Studies, Inspiration, Web Design","author":{"@id":"https://elementor.com/blog/author/anakaric/","name":"Ana Kari\u0107"},"publisher":{"@id":"https://elementor.com/blog/#organization"},"description":"Learn how OSM design agency used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look.","copyrightYear":"2021","copyrightHolder":{"@id":"https://elementor.com/blog/#organization"},"name":"How A Leading Design Agency Revamped Their Website With Elementor | Elementor","@id":"https://elementor.com/blog/osm-and-elementor/#richSnippet","isPartOf":{"@id":"https://elementor.com/blog/osm-and-elementor/#webpage"},"image":{"@id":"https://elementor.com/blog/wp-content/uploads/2021/10/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg"},"inLanguage":"en-US","mainEntityOfPage":{"@id":"https://elementor.com/blog/osm-and-elementor/#webpage"}}]}</script>  <link rel="alternate" type="application/rss+xml" title="Elementor » Feed" href="https://elementor.com/blog/feed/" /> <link rel="alternate" type="application/rss+xml" title="Elementor » Comments Feed" href="https://elementor.com/blog/comments/feed/" /> <link rel="alternate" type="application/rss+xml" title="Elementor » How a Leading Design Agency Revamped Their Website With Elementor Comments Feed" href="https://elementor.com/blog/osm-and-elementor/feed/" /> <style id='rank-math-toc-block-style-inline-css'> .wp-block-rank-math-toc-block nav ol{counter-reset:item}.wp-block-rank-math-toc-block nav ol li{display:block}.wp-block-rank-math-toc-block nav ol li:before{content:counters(item, ".") ". ";counter-increment:item} </style> <style id='classic-theme-styles-inline-css'> /*! This file is auto-generated */ .wp-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.wp-block-file__button{background:#32373c;color:#fff;text-decoration:none} </style> <style id='global-styles-inline-css'> :root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}:where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;} :where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;} :where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;} :root :where(.wp-block-pullquote){font-size: 1.5em;line-height: 1.6;} </style> <link rel='stylesheet' id='wpml-blocks-css' href='https://elementor.com/blog/wp-content/plugins/sitepress-multilingual-cms/dist/css/blocks/styles.css?ver=4.6.13' media='all' /> <link rel='stylesheet' id='wpml-legacy-horizontal-list-0-css' href='https://elementor.com/blog/wp-content/plugins/sitepress-multilingual-cms/templates/language-switchers/legacy-list-horizontal/style.min.css?ver=1' media='all' /> <link rel='stylesheet' id='hello-elementor-css' href='https://elementor.com/blog/wp-content/themes/hello-elementor/style.min.css?ver=3.1.1' media='all' /> <link rel='stylesheet' id='hello-elementor-theme-style-css' href='https://elementor.com/blog/wp-content/themes/hello-elementor/theme.min.css?ver=3.1.1' media='all' /> <link rel='stylesheet' id='hello-elementor-header-footer-css' href='https://elementor.com/blog/wp-content/themes/hello-elementor/header-footer.min.css?ver=3.1.1' media='all' /> <link rel='stylesheet' id='elementor-frontend-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/frontend.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-nav-menu-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-nav-menu.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-mega-menu-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-mega-menu.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-heading-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-heading.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-social-icons-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-social-icons.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='e-apple-webkit-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/conditionals/apple-webkit.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-text-editor-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-text-editor.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-forms-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-forms.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-icon-list-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-icon-list.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-loop-builder-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-loop-builder.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-theme-elements-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-theme-elements.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-image-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-image.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-share-buttons-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-share-buttons.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='widget-call-to-action-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/widget-call-to-action.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='e-animation-fadeIn-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/animations/styles/fadeIn.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='swiper-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/swiper/v8/css/swiper.min.css?ver=8.4.5' media='all' /> <link rel='stylesheet' id='e-swiper-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/conditionals/e-swiper.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='elementor-post-74425-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-74425.css?ver=1730805161' media='all' /> <link rel='stylesheet' id='elementor-pro-css' href='https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/css/frontend.min.css?ver=3.24.4' media='all' /> <link rel='stylesheet' id='font-awesome-5-all-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/font-awesome/css/all.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='font-awesome-4-shim-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/font-awesome/css/v4-shims.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='elementor-global-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/global.css?ver=1730805166' media='all' /> <link rel='stylesheet' id='widget-video-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-video.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='widget-menu-anchor-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/css/widget-menu-anchor.min.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='elementor-post-67261-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-67261.css?ver=1730880437' media='all' /> <link rel='stylesheet' id='elementor-post-18069-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-18069.css?ver=1730805166' media='all' /> <link rel='stylesheet' id='elementor-post-18066-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-18066.css?ver=1730805166' media='all' /> <link rel='stylesheet' id='elementor-post-79012-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-79012.css?ver=1730880137' media='all' /> <link rel='stylesheet' id='elementor-post-95567-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-95567.css?ver=1730805685' media='all' /> <link rel='stylesheet' id='elementor-post-84405-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-84405.css?ver=1730805685' media='all' /> <link rel='stylesheet' id='hello-elementor-child-style-css' href='https://elementor.com/blog/wp-content/themes/hello-theme-child-master/style.css?ver=2.0.0' media='all' /> <link rel='stylesheet' id='google-fonts-1-css' href='https://fonts.googleapis.com/css?family=DM+Sans%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic&display=auto&ver=6.6.2' media='all' /> <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin><script id="wpml-cookie-js-extra"> var wpml_cookies = {"wp-wpml_current_language":{"value":"en","expires":1,"path":"\/"}}; var wpml_cookies = {"wp-wpml_current_language":{"value":"en","expires":1,"path":"\/"}}; </script> <script src="https://elementor.com/blog/wp-content/plugins/sitepress-multilingual-cms/res/js/cookies/language-cookie.js?ver=4.6.13" id="wpml-cookie-js" defer data-wp-strategy="defer"></script> <script src="https://elementor.com/blog/wp-includes/js/jquery/jquery.min.js?ver=3.7.1" id="jquery-core-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/font-awesome/js/v4-shims.min.js?ver=3.24.6" id="font-awesome-4-shim-js"></script> <meta name="generator" content="WPML ver:4.6.13 stt:37,1,4,3,27,42,2;" /> <style> .wpml-review__modal-mask{ z-index: 9 !important; } </style> <meta name="referrer" content="no-referrer-when-downgrade">  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://gtm.elementor.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-NJK8HW');</script>  <style>#wp-admin-bar-ELEMENTOR-ENV a {background: #92003B;font-weight: bold;padding: 0px !important;width: 160px;text-align: center;}</style> <style> .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload), .e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded):not(.e-no-lazyload) * { background-image: none !important; } @media screen and (max-height: 1024px) { .e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload), .e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded):not(.e-no-lazyload) * { background-image: none !important; } } @media screen and (max-height: 640px) { .e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload), .e-con.e-parent:nth-of-type(n+2):not(.e-lazyloaded):not(.e-no-lazyload) * { background-image: none !important; } } </style> <link rel="icon" href="https://elementor.com/blog/wp-content/uploads/2021/07/elementor-favicon-512.png" sizes="32x32" /> <link rel="icon" href="https://elementor.com/blog/wp-content/uploads/2021/07/elementor-favicon-512.png" sizes="192x192" /> <link rel="apple-touch-icon" href="https://elementor.com/blog/wp-content/uploads/2021/07/elementor-favicon-512.png" /> <meta name="msapplication-TileImage" content="https://elementor.com/blog/wp-content/uploads/2021/07/elementor-favicon-512.png" /> </head> <body class="post-template-default single single-post postid-67261 single-format-standard category-stories elementor-default elementor-kit-74425 elementor-page elementor-page-67261 elementor-page-79012"> <a class="skip-link screen-reader-text" href="#content">Skip to content</a> <header data-elementor-type="header" data-elementor-id="18069" class="elementor elementor-18069 elementor-location-header" data-elementor-post-type="elementor_library"> <header class="elementor-element elementor-element-13a69fbc main-header e-con-full e-flex e-con e-parent" data-id="13a69fbc" data-element_type="container" data-settings="{"background_background":"classic","sticky_effects_offset":72,"sticky":"top","sticky_on":["desktop","tablet","mobile"],"sticky_offset":0}" data-gtm-element-location="header navigation bar"> <div class="elementor-element elementor-element-728fb85 e-fit_to_content elementor-fixed e-n-menu-none elementor-widget__width-auto e-n-menu-layout-horizontal elementor-widget elementor-widget-n-menu" data-id="728fb85" data-element_type="widget" data-settings="{"content_width":"fit_to_content","menu_items":[{"item_title":"","_id":"3287ed6","item_dropdown_content":"yes","item_icon":{"value":{"url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2018\/10\/e-symbol.svg","id":96045},"library":"svg"},"__dynamic__":null,"item_link":{"url":"","is_external":"","nofollow":"","custom_attributes":""},"item_icon_active":{"value":"","library":""},"element_id":""}],"content_horizontal_position":"left","_position":"fixed","breakpoint_selector":"none","item_layout":"horizontal","open_on":"hover","horizontal_scroll":"disable","menu_item_title_distance_from_content":{"unit":"px","size":0,"sizes":[]},"menu_item_title_distance_from_content_tablet":{"unit":"px","size":"","sizes":[]},"menu_item_title_distance_from_content_mobile":{"unit":"px","size":"","sizes":[]}}" data-widget_type="mega-menu.default"> <div class="elementor-widget-container"> <nav class="e-n-menu" data-widget-number="120" aria-label="Menu"> <button class="e-n-menu-toggle" id="menu-toggle-120" aria-haspopup="true" aria-expanded="false" aria-controls="menubar-120" aria-label="Menu Toggle"> <span class="e-n-menu-toggle-icon e-open"> <svg class="e-font-icon-svg e-eicon-menu-bar" viewBox="0 0 1000 1000" xmlns="http://www.w3.org/2000/svg"><path d="M104 333H896C929 333 958 304 958 271S929 208 896 208H104C71 208 42 237 42 271S71 333 104 333ZM104 583H896C929 583 958 554 958 521S929 458 896 458H104C71 458 42 487 42 521S71 583 104 583ZM104 833H896C929 833 958 804 958 771S929 708 896 708H104C71 708 42 737 42 771S71 833 104 833Z"></path></svg> </span> <span class="e-n-menu-toggle-icon e-close"> <svg class="e-font-icon-svg e-eicon-close" viewBox="0 0 1000 1000" xmlns="http://www.w3.org/2000/svg"><path d="M742 167L500 408 258 167C246 154 233 150 217 150 196 150 179 158 167 167 154 179 150 196 150 212 150 229 154 242 171 254L408 500 167 742C138 771 138 800 167 829 196 858 225 858 254 829L496 587 738 829C750 842 767 846 783 846 800 846 817 842 829 829 842 817 846 804 846 783 846 767 842 750 829 737L588 500 833 258C863 229 863 200 833 171 804 137 775 137 742 167Z"></path></svg> </span> </button> <div class="e-n-menu-wrapper" id="menubar-120" aria-labelledby="menu-toggle-120"> <ul class="e-n-menu-heading"> <li class="e-n-menu-item"> <div id="e-n-menu-title-1201" class="e-n-menu-title"> <div class="e-n-menu-title-container"> <span class="e-n-menu-icon"> <span class="icon-active"><svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.5 10.5C0.5 15.9857 4.95951 20.4334 10.4599 20.4334C15.9603 20.4334 20.4198 15.9857 20.4198 10.5C20.4198 5.01422 15.9603 0.566589 10.4599 0.566589C4.95951 0.566589 0.5 5.01422 0.5 10.5ZM7.96964 6.36127H6.30991V14.6393H7.96964V6.36127ZM9.62944 6.36127H14.6087V8.01659H9.62944V6.36127ZM14.6087 9.67175H9.62944V11.3271H14.6087V9.67175ZM9.62944 12.9839H14.6087V14.6392H9.62944V12.9839Z" fill="currentColor"></path></svg></span> <span class="icon-inactive"><svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.5 10.5C0.5 15.9857 4.95951 20.4334 10.4599 20.4334C15.9603 20.4334 20.4198 15.9857 20.4198 10.5C20.4198 5.01422 15.9603 0.566589 10.4599 0.566589C4.95951 0.566589 0.5 5.01422 0.5 10.5ZM7.96964 6.36127H6.30991V14.6393H7.96964V6.36127ZM9.62944 6.36127H14.6087V8.01659H9.62944V6.36127ZM14.6087 9.67175H9.62944V11.3271H14.6087V9.67175ZM9.62944 12.9839H14.6087V14.6392H9.62944V12.9839Z" fill="currentColor"></path></svg></span> </span> <span class="e-n-menu-title-text"> </span> </div> <button id="e-n-menu-dropdown-icon-1201" class="e-n-menu-dropdown-icon e-focus" data-tab-index="1" aria-haspopup="true" aria-expanded="false" aria-controls="e-n-menu-content-1201" > <span class="e-n-menu-dropdown-icon-opened"> <span class="elementor-screen-only">Close </span> </span> <span class="e-n-menu-dropdown-icon-closed"> <span class="elementor-screen-only">Open </span> </span> </button> </div> <div class="e-n-menu-content"> <div id="e-n-menu-content-1201" data-tab-index="1" aria-labelledby="e-n-menu-dropdown-icon-1201" class="elementor-element elementor-element-748e415 e-flex e-con-boxed e-con e-child" data-id="748e415" data-element_type="container"> <div class="e-con-inner"> <div class="elementor-element elementor-element-1f49823 e-con-full e-flex e-con e-child" data-id="1f49823" data-element_type="container"> <div class="elementor-element elementor-element-a3bdd79 elementor-widget__width-initial sub-nav elementor-nav-menu__text-align-aside elementor-widget elementor-widget-nav-menu" data-id="a3bdd79" data-element_type="widget" data-settings="{"layout":"dropdown","submenu_icon":{"value":"<i class=\"\"><\/i>","library":""}}" data-widget_type="nav-menu.default"> <div class="elementor-widget-container"> <nav class="elementor-nav-menu--dropdown elementor-nav-menu__container" aria-hidden="true"> <ul id="menu-2-a3bdd79" class="elementor-nav-menu"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-95916"><a href="#" class="elementor-item elementor-item-anchor" tabindex="-1">Products</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95917"><a href="https://elementor.com/products/page-builder-plugin/" class="elementor-sub-item" tabindex="-1">Page Builder Plugin</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95918"><a href="https://elementor.com/wordpress-hosting/" class="elementor-sub-item" tabindex="-1">WordPress Hosting</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95919"><a href="https://elementor.com/products/ecommerce-hosting/" class="elementor-sub-item" tabindex="-1">eCommerce Hosting</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95921"><a href="https://elementor.com/products/ai/" class="elementor-sub-item" tabindex="-1">Elementor AI</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95922"><a href="https://elementor.com/products/image-optimizer/" class="elementor-sub-item" tabindex="-1">Image Optimizer</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-119156"><a href="https://elementor.com/products/site-mailer/" class="elementor-sub-item" tabindex="-1">Site Mailer</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95923"><a href="https://elementor.com/products/hello-theme/" class="elementor-sub-item" tabindex="-1">Hello Theme</a></li> </ul> </li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-95924"><a href="#" class="elementor-item elementor-item-anchor" tabindex="-1">Hosting</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95925"><a href="https://elementor.com/wordpress-hosting/" class="elementor-sub-item" tabindex="-1">WordPress Hosting</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95926"><a href="https://elementor.com/products/ecommerce-hosting/" class="elementor-sub-item" tabindex="-1">eCommerce Hosting</a></li> </ul> </li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-95928"><a href="#" class="elementor-item elementor-item-anchor" tabindex="-1">Web Creation</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95929"><a href="https://elementor.com/features/wordpress/" class="elementor-sub-item" tabindex="-1">Elementor + WordPress</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95930"><a href="https://elementor.com/features/woocommerce-builder/" class="elementor-sub-item" tabindex="-1">Elementor + WooCommerce</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95931"><a href="https://elementor.com/for/designer/" class="elementor-sub-item" tabindex="-1">Web Design</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95932"><a href="https://elementor.com/widgets/" class="elementor-sub-item" tabindex="-1">Widgets</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95933"><a href="https://elementor.com/features/" class="elementor-sub-item" tabindex="-1">All Features</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95934"><a href="https://elementor.com/library/" class="elementor-sub-item" tabindex="-1">Kits Library</a></li> </ul> </li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-95935"><a href="#" class="elementor-item elementor-item-anchor" tabindex="-1">Resources</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95936"><a href="https://elementor.com/blog/" class="elementor-sub-item" tabindex="-1">Blog</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95937"><a href="https://elementor.com/help/" class="elementor-sub-item" tabindex="-1">Help Center</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95938"><a href="https://elementor.com/community/" class="elementor-sub-item" tabindex="-1">Community</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95939"><a href="https://elementor.com/roadmap/" class="elementor-sub-item" tabindex="-1">Roadmap</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95940"><a href="https://showoff.elementor.com/" class="elementor-sub-item" tabindex="-1">Elementor Showoff</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95941"><a href="https://developers.elementor.com/" class="elementor-sub-item" tabindex="-1">Developers Website</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95942"><a href="https://elementor.com/support/" class="elementor-sub-item" tabindex="-1">Support</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95943"><a href="https://elementor.com/addons/" class="elementor-sub-item" tabindex="-1">Add-ons</a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-95944"><a href="https://prompts.elementor.com/" class="elementor-sub-item" tabindex="-1">AI Prompt Library</a></li> </ul> </li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-95945"><a href="#" class="elementor-item elementor-item-anchor" tabindex="-1">Pricing</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="nav-desc menu-item menu-item-type-custom menu-item-object-custom menu-item-95946"><a href="https://elementor.com/pricing/" class="elementor-sub-item" tabindex="-1">WordPress Hosting</a></li> <li class="nav-desc menu-item menu-item-type-custom menu-item-object-custom menu-item-95947"><a href="https://elementor.com/pricing-ecommerce-hosting/" class="elementor-sub-item" tabindex="-1">eCommerce Hosting</a></li> <li class="nav-desc menu-item menu-item-type-custom menu-item-object-custom menu-item-95949"><a href="https://elementor.com/pricing-plugin/" class="elementor-sub-item" tabindex="-1">Page Builder Pro Plugin</a></li> </ul> </li> </ul> </nav> </div> </div> <div class="elementor-element elementor-element-b6f3541 e-con-full e-flex e-con e-child" data-id="b6f3541" data-element_type="container" data-settings="{"background_background":"gradient","position":"absolute"}"> </div> </div> </div> </div> </div> </li> </ul> </div> </nav> </div> </div> <div class="elementor-element elementor-element-4613608a site-logo elementor-view-default elementor-widget elementor-widget-icon" data-id="4613608a" data-element_type="widget" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <a class="elementor-icon" href="https://elementor.com/" aria-label="Go to elementor.com homepage" data-gtm-event_name="element_click" data-gtm-type="ui" data-gtm-section="header" data-gtm-element_name="logo" data-gtm-outcome="restart navigation"> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="elementor-logo" width="163" height="27" viewBox="0 0 163 27" fill="none"><title id="catTitle">Elementor Logo</title><path d="M102.054 12.939C102.054 12.939 100.65 13.2733 99.465 13.5566L97.6605 13.9676C97.6546 13.9676 97.6467 13.9676 97.6447 13.9676C97.6447 13.4818 97.6801 12.9685 97.7961 12.4965C97.9455 11.8907 98.2738 11.1827 98.8419 10.8719C99.4611 10.5336 100.216 10.4943 100.872 10.7559C101.551 11.0253 101.861 11.6803 101.995 12.3588C102.032 12.5476 102.058 12.7384 102.075 12.9311L102.054 12.939ZM106.756 13.9656C106.756 9.25916 103.792 7.23535 100.006 7.23535C95.7242 7.23535 93.043 10.2012 93.043 13.9892C93.043 18.1077 95.3252 20.7903 100.241 20.7903C102.899 20.7903 104.405 20.3203 106.192 19.4254L105.51 16.3415C104.145 16.9532 102.876 17.3288 101.181 17.3288C99.3235 17.3288 98.2639 16.6227 97.8649 15.305H106.638C106.709 14.953 106.756 14.5537 106.756 13.9656Z" fill="currentColor"></path><path d="M62.9249 12.939C62.9249 12.939 61.5214 13.2733 60.3361 13.5566L58.5316 13.9676C58.5257 13.9676 58.5178 13.9676 58.5158 13.9676C58.5158 13.4818 58.5512 12.9685 58.6672 12.4965C58.8166 11.8907 59.1449 11.1827 59.7129 10.8719C60.3322 10.5336 61.087 10.4943 61.7435 10.7559C62.4217 11.0253 62.7323 11.6803 62.866 12.3588C62.9033 12.5476 62.9289 12.7384 62.9466 12.9311L62.9249 12.939ZM67.627 13.9656C67.627 9.25916 64.6626 7.23535 60.8767 7.23535C56.5953 7.23535 53.9141 10.2012 53.9141 13.9892C53.9141 18.1077 56.1963 20.7903 61.1125 20.7903C63.7702 20.7903 65.2759 20.3203 67.0628 19.4254L66.3807 16.3415C65.0165 16.9532 63.7466 17.3288 62.0522 17.3288C60.1946 17.3288 59.135 16.6227 58.736 15.305H67.509C67.5798 14.953 67.627 14.5537 67.627 13.9656Z" fill="currentColor"></path><path d="M52.311 3.77588H47.9668V20.3204H52.311V3.77588Z" fill="currentColor"></path><path d="M107.674 7.65838H112.238L113.198 10.583C113.799 9.13936 115.151 7.28076 117.55 7.28076C120.842 7.28076 122.631 8.95055 122.631 13.2578V20.3185H118.069C118.069 18.8474 118.071 17.3762 118.072 15.9051C118.072 15.2305 118.061 14.5559 118.071 13.8813C118.078 13.2578 118.122 12.6147 117.791 12.0561C117.567 11.6785 117.2 11.4012 116.803 11.2123C115.997 10.8269 115.124 10.8387 114.334 11.2497C114.139 11.35 113.199 11.8594 113.199 12.0954V20.3185H108.637V11.0747L107.674 7.65838Z" fill="currentColor"></path><path d="M126.324 10.9755H124.23V7.65759H126.324V5.58265L130.886 4.50879V7.65759H135.472V10.9755H130.886V14.6947C130.886 16.1541 131.592 16.8365 132.65 16.8365C133.731 16.8365 134.344 16.6949 135.26 16.3901L135.801 19.826C134.554 20.3669 133.002 20.6265 131.425 20.6265C128.109 20.6265 126.32 19.0491 126.32 15.9908V10.9755H126.324Z" fill="currentColor"></path><path d="M144.252 17.026C145.921 17.026 146.91 15.8262 146.91 13.8949C146.91 11.9635 145.968 10.8582 144.323 10.8582C142.652 10.8582 141.689 11.9635 141.689 13.9657C141.689 15.8479 142.631 17.026 144.252 17.026ZM144.299 7.16455C148.581 7.16455 151.708 9.84723 151.708 14.0129C151.708 18.2021 148.581 20.7196 144.252 20.7196C139.947 20.7196 136.889 18.1313 136.889 14.0129C136.891 9.84723 139.926 7.16455 144.299 7.16455Z" fill="currentColor"></path><path d="M88.9542 7.61891C88.1463 7.28652 87.2322 7.16262 86.3614 7.28849C85.9172 7.35339 85.4827 7.48123 85.0798 7.67988C83.975 8.22664 83.1121 9.47161 82.6482 10.5828C82.3454 9.30443 81.4589 8.1519 80.1655 7.61891C79.3575 7.28652 78.4435 7.16262 77.5727 7.28849C77.1284 7.35339 76.694 7.48123 76.291 7.67988C75.1882 8.22467 74.3272 9.46571 73.8633 10.573V10.4924L72.9335 7.65824H68.3711L69.3323 11.0745V20.3203H73.8653V12.0599C73.881 11.9989 74.0835 11.8848 74.1189 11.8573C74.6496 11.4797 75.2747 11.0903 75.9391 11.0411C76.6173 10.99 77.2857 11.3361 77.6906 11.875C77.7339 11.934 77.7751 11.993 77.8125 12.0559C78.1447 12.6145 78.0995 13.2576 78.0916 13.8811C78.0837 14.5557 78.0955 15.2303 78.0936 15.9049C78.0916 17.3761 78.0896 18.8472 78.0896 20.3184H82.6541V13.2576C82.6541 13.2222 82.6541 13.1868 82.6541 13.1514V12.0618C82.6639 12.0028 82.8723 11.8829 82.9096 11.8573C83.4404 11.4797 84.0655 11.0903 84.7299 11.0411C85.408 10.99 86.0764 11.3361 86.4813 11.875C86.5246 11.934 86.5659 11.993 86.6032 12.0559C86.9354 12.6145 86.8902 13.2576 86.8843 13.8811C86.8764 14.5557 86.8882 15.2303 86.8863 15.9049C86.8843 17.3761 86.8823 18.8472 86.8823 20.3184H91.4448V13.2576C91.4428 11.1886 91.146 8.52166 88.9542 7.61891Z" fill="currentColor"></path><path d="M162.503 7.28271C160.105 7.28271 158.752 9.14131 158.151 10.5849L157.189 7.66033H152.625L153.586 11.0766V20.3224H158.151V11.7788C158.801 11.6647 162.33 12.3137 163 12.5596V7.29845C162.837 7.28861 162.672 7.28271 162.503 7.28271Z" fill="currentColor"></path><path d="M41.6632 12.5161C41.6632 12.5161 40.2597 12.8505 39.0744 13.1337L37.2698 13.5448C37.2639 13.5448 37.2561 13.5448 37.2541 13.5448C37.2541 13.059 37.2895 12.5456 37.4055 12.0736C37.5548 11.4679 37.8831 10.7598 38.4512 10.4491C39.0704 10.1108 39.8253 10.0714 40.4818 10.333C41.16 10.6025 41.4706 11.2574 41.6042 11.9359C41.6416 12.1248 41.6671 12.3155 41.6848 12.5083L41.6632 12.5161ZM46.3672 13.5428C46.3672 8.83631 43.4029 6.8125 39.6169 6.8125C35.3355 6.8125 32.6543 9.77839 32.6543 13.5664C32.6543 17.6848 34.9365 20.3675 39.8528 20.3675C42.5104 20.3675 44.0162 19.8974 45.803 19.0026L45.1209 15.9187C43.7567 16.5303 42.4868 16.906 40.7924 16.906C38.9348 16.906 37.8753 16.1999 37.4762 14.8822H46.2492C46.32 14.5321 46.3672 14.1309 46.3672 13.5428Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.2084C0 20.4107 5.83624 26.2501 13.0347 26.2501C20.2332 26.2501 26.0695 20.4107 26.0695 13.2084C26.0695 6.00609 20.2332 0.166748 13.0347 0.166748C5.83624 0.166748 0 6.00609 0 13.2084ZM9.77554 7.77424H7.60342V18.6426H9.77554V7.77424ZM11.9477 7.77424H18.4641V9.94753H11.9477V7.77424ZM18.4641 12.1208H11.9477V14.2941H18.4641V12.1208ZM11.9477 16.4693H18.4641V18.6426H11.9477V16.4693Z" fill="currentColor"></path></svg> </a> </div> </div> </div> <div class="elementor-element elementor-element-64b2e5a9 elementor-widget__width-initial logo-txt elementor-widget elementor-widget-heading" data-id="64b2e5a9" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <span class="elementor-heading-title elementor-size-default"><a href="https://elementor.com/blog" aria-label="Go to the Blog homepage">blog</a></span> </div> </div> <div class="elementor-element elementor-element-b43a638 elementor-nav-menu--stretch main-nav elementor-widget__width-auto elementor-nav-menu--dropdown-tablet elementor-nav-menu__text-align-aside elementor-nav-menu--toggle elementor-nav-menu--burger elementor-widget elementor-widget-nav-menu" data-id="b43a638" data-element_type="widget" data-settings="{"full_width":"stretch","submenu_icon":{"value":"<i class=\"\"><\/i>","library":""},"layout":"horizontal","toggle":"burger"}" data-widget_type="nav-menu.default"> <div class="elementor-widget-container"> <nav aria-label="Menu" class="elementor-nav-menu--main elementor-nav-menu__container elementor-nav-menu--layout-horizontal e--pointer-none"> <ul id="menu-1-b43a638" class="elementor-nav-menu"><li class="all-categories menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-has-children menu-item-31007"><a href="https://elementor.com/blog/" class="elementor-item">Categories</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-30912"><a href="#" class="elementor-sub-item elementor-item-anchor">Elementor</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30883"><a href="https://elementor.com/blog/category/new-features/" class="elementor-sub-item">New Features</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-54865"><a href="https://elementor.com/blog/category/elementor-team-writes/" class="elementor-sub-item">Elementor Team Writes</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30879"><a href="https://elementor.com/blog/category/showcase/" class="elementor-sub-item">Showcase</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30913"><a href="https://elementor.com/blog/category/news/" class="elementor-sub-item">News</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-31006"><a href="https://elementor.com/blog/category/stories/" class="elementor-sub-item">Case Studies</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-40486"><a href="https://elementor.com/blog/category/community/" class="elementor-sub-item">Community</a></li> </ul> </li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-30874"><a href="https://elementor.com/blog/category/design/" class="elementor-sub-item">Design</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30876"><a href="https://elementor.com/blog/category/marketing/" class="elementor-sub-item">Marketing</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30888"><a href="https://elementor.com/blog/category/development/" class="elementor-sub-item">Development</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30890"><a href="https://elementor.com/blog/category/business/" class="elementor-sub-item">Business</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30877"><a href="https://elementor.com/blog/category/wordpress/" class="elementor-sub-item">WordPress</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-82887"><a href="https://elementor.com/blog/category/hosting/" class="elementor-sub-item">Hosting</a></li> </ul> </li> </ul> </nav> <div class="elementor-menu-toggle" role="button" tabindex="0" aria-label="Menu Toggle" aria-expanded="false"> <span class="elementor-menu-toggle__icon--open"><svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 33 33" width="33" height="33"><path fill-rule="evenodd" clip-rule="evenodd" d="M33 14.5H0v-3h33v3Zm0 8H13.396v-3H33v3Z" fill="currentColor"></path></svg></span><span class="elementor-menu-toggle__icon--close"><svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 33 33" width="33" height="33"><path fill-rule="evenodd" clip-rule="evenodd" d="m16.859 18.484-7.787 7.33-2.143-2.278 7.649-7.199-7.65-7.199 2.144-2.277 7.787 7.33 7.787-7.33 2.143 2.277-7.65 7.2 7.65 7.198-2.143 2.277-7.787-7.329Z" fill="currentColor"></path></svg></span> <span class="elementor-screen-only">Menu</span> </div> <nav class="elementor-nav-menu--dropdown elementor-nav-menu__container" aria-hidden="true"> <ul id="menu-2-b43a638" class="elementor-nav-menu"><li class="all-categories menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-has-children menu-item-31007"><a href="https://elementor.com/blog/" class="elementor-item" tabindex="-1">Categories</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-30912"><a href="#" class="elementor-sub-item elementor-item-anchor" tabindex="-1">Elementor</a> <ul class="sub-menu elementor-nav-menu--dropdown"> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30883"><a href="https://elementor.com/blog/category/new-features/" class="elementor-sub-item" tabindex="-1">New Features</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-54865"><a href="https://elementor.com/blog/category/elementor-team-writes/" class="elementor-sub-item" tabindex="-1">Elementor Team Writes</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30879"><a href="https://elementor.com/blog/category/showcase/" class="elementor-sub-item" tabindex="-1">Showcase</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30913"><a href="https://elementor.com/blog/category/news/" class="elementor-sub-item" tabindex="-1">News</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-31006"><a href="https://elementor.com/blog/category/stories/" class="elementor-sub-item" tabindex="-1">Case Studies</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-40486"><a href="https://elementor.com/blog/category/community/" class="elementor-sub-item" tabindex="-1">Community</a></li> </ul> </li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-30874"><a href="https://elementor.com/blog/category/design/" class="elementor-sub-item" tabindex="-1">Design</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30876"><a href="https://elementor.com/blog/category/marketing/" class="elementor-sub-item" tabindex="-1">Marketing</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30888"><a href="https://elementor.com/blog/category/development/" class="elementor-sub-item" tabindex="-1">Development</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30890"><a href="https://elementor.com/blog/category/business/" class="elementor-sub-item" tabindex="-1">Business</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-30877"><a href="https://elementor.com/blog/category/wordpress/" class="elementor-sub-item" tabindex="-1">WordPress</a></li> <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-82887"><a href="https://elementor.com/blog/category/hosting/" class="elementor-sub-item" tabindex="-1">Hosting</a></li> </ul> </li> </ul> </nav> </div> </div> <div class="elementor-element elementor-element-3a1d589f elementor-widget__width-auto open-search elementor-view-default elementor-widget elementor-widget-icon" data-id="3a1d589f" data-element_type="widget" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <div class="elementor-icon"> <svg aria-hidden="true" class="e-font-icon-svg e-fas-search" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"></path></svg> </div> </div> </div> </div> <div class="elementor-element elementor-element-75a76e53 elementor-widget__width-auto open-search-dialog elementor-widget elementor-widget-shortcode" data-id="75a76e53" data-element_type="widget" data-widget_type="shortcode.default"> <div class="elementor-widget-container"> <div class="elementor-shortcode"><form role="search" method="get" class="search-form" action="https://elementor.com/blog/search/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="q"> </label> <input type="submit" class="search-submit" value="Search"> </form> <span class='open-search-close'>✕</span> <script> const toggleOpenSearch = () => { document.querySelector( '.search-field' )?.focus(); document.querySelector( '.open-search-dialog' )?.classList.toggle( 'open' ); } document.querySelector( '.open-search-close' )?.addEventListener( 'click', toggleOpenSearch); document.querySelector( '.open-search' )?.addEventListener( 'click', toggleOpenSearch); </script></div> </div> </div> <div class="elementor-element elementor-element-493d5504 e-con-full e-flex e-con e-child" data-id="493d5504" data-element_type="container"> <div class="elementor-element elementor-element-7e884066 elementor-align-justify elementor-widget elementor-widget-button" data-id="7e884066" data-element_type="widget" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button toggle elementor-button-link elementor-size-sm" href="#!" aria-label="Language Switcher Toggle"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M0 8C0 12.41 3.58705 15.9982 7.99666 16L8 16C12.4111 16 16 12.4111 16 8C16 3.58886 12.4111 0 8 0C3.58886 0 0 3.58886 0 8ZM5.72601 1.37905C4.1452 1.92344 2.81876 3.01903 1.97741 4.43511H4.40479C4.70626 3.19596 5.16236 2.1459 5.72601 1.37905ZM1 8C1 7.09507 1.17258 6.22972 1.48655 5.43511H4.20235C4.07089 6.23713 4 7.09896 4 8C4 8.85264 4.06347 9.67016 4.18169 10.4351H1.48228C1.46724 10.4351 1.45236 10.4358 1.43767 10.4372C1.15471 9.67785 1 8.85662 1 8ZM1.90239 11.4351C2.73873 12.9138 4.09733 14.0598 5.72593 14.6208C5.14274 13.8274 4.6747 12.7307 4.37394 11.4351H1.90239ZM5.40582 11.4351C5.96709 13.6344 7.02203 15 8 15H8.00217C8.97953 14.998 10.0333 13.6328 10.5942 11.4351H5.40582ZM11.6261 11.4351C11.3253 12.7306 10.8573 13.8272 10.2742 14.6207C11.9025 14.0596 13.261 12.9136 14.0974 11.4351H11.6261ZM14.5623 10.437C14.5482 10.4358 14.5339 10.4351 14.5194 10.4351H11.8183C11.9365 9.67016 12 8.85264 12 8C12 7.09896 11.9291 6.23713 11.7976 5.43511H14.5133C14.8274 6.22972 15 7.09507 15 8C15 8.85656 14.8453 9.67774 14.5623 10.437ZM10.8042 10.4351H5.19582C5.07078 9.68964 5 8.8728 5 8C5 7.07626 5.07928 6.21522 5.21827 5.43511H10.7817C10.9207 6.21522 11 7.07626 11 8C11 8.8728 10.9292 9.68964 10.8042 10.4351ZM11.5952 4.43511H14.0224C13.181 3.01917 11.8546 1.92364 10.2741 1.3792C10.8377 2.14604 11.2938 3.19605 11.5952 4.43511ZM5.43976 4.43511H10.5602C9.99113 2.31199 8.95858 1 8 1C7.04141 1 6.00887 2.31199 5.43976 4.43511Z" fill="currentColor"></path></svg> </span> </span> </a> </div> </div> </div> <div class="elementor-element elementor-element-4f23a02f dropdown-wrapper e-con-full e-flex e-con e-child" data-id="4f23a02f" data-element_type="container" data-settings="{"position":"absolute","background_background":"classic"}"> <div class="elementor-element elementor-element-4d0eedf5 elementor-widget elementor-widget-wpml-language-switcher" data-id="4d0eedf5" data-element_type="widget" data-widget_type="wpml-language-switcher.default"> <div class="elementor-widget-container"> <div class="wpml-elementor-ls"> <div class="wpml-ls-statics-shortcode_actions wpml-ls wpml-ls-legacy-list-horizontal"> <ul><li class="wpml-ls-slot-shortcode_actions wpml-ls-item wpml-ls-item-en wpml-ls-current-language wpml-ls-first-item wpml-ls-last-item wpml-ls-item-legacy-list-horizontal"> <a href="https://elementor.com/blog/osm-and-elementor/" class="wpml-ls-link"> <span class="wpml-ls-native">English</span></a> </li></ul> </div> </div> </div> </div> </div> </div> <div class="elementor-element elementor-element-5bf019f0 elementor-align-justify nav-login elementor-hidden-tablet elementor-hidden-phone elementor-widget elementor-widget-button" data-id="5bf019f0" data-element_type="widget" data-gtm-section="header" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://my.elementor.com/login/?redirect_to=%2Fwebsites%2F" aria-label="Login to you Elementor account" data-gtm-event_name="element_click" data-gtm-action_type="login" data-gtm-element-location="header"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-text">Login</span> </span> </a> </div> </div> </div> <div class="elementor-element elementor-element-f3ce659 elementor-align-justify elementor-hidden-tablet elementor-hidden-phone get-started-btn elementor-widget elementor-widget-button" data-id="f3ce659" data-element_type="widget" data-gac="CTA Elements" data-gaa="onboarding button click" data-gal="header navigation bar" data-gtm-section="header" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://my.elementor.com/signup/?redirect_to=https://my.elementor.com/get-started/" aria-label="Get Started With Elementor"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-text">Get Started</span> </span> </a> </div> </div> </div> </header> </header> <div data-elementor-type="single-post" data-elementor-id="79012" class="elementor elementor-79012 elementor-location-single post-67261 post type-post status-publish format-standard has-post-thumbnail hentry category-stories category-inspiration category-design tag-pro" data-elementor-post-type="elementor_library"> <section class="elementor-section elementor-top-section elementor-element elementor-element-764380d sc-hero elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="764380d" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2011ef2" data-id="2011ef2" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-03c6b5e elementor-widget__width-initial elementor-widget-mobile__width-inherit elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading" data-id="03c6b5e" data-element_type="widget" data-widget_type="theme-post-title.default"> <div class="elementor-widget-container"> <h1 class="elementor-heading-title elementor-size-default">How a Leading Design Agency Revamped Their Website With Elementor</h1> </div> </div> <div class="elementor-element elementor-element-11d9a12 entry elementor-widget__width-initial elementor-align-center elementor-widget elementor-widget-post-info" data-id="11d9a12" data-element_type="widget" data-widget_type="post-info.default"> <div class="elementor-widget-container"> <ul class="elementor-inline-items elementor-icon-list-items elementor-post-info"> <li class="elementor-icon-list-item elementor-repeater-item-f77f42a elementor-inline-item" itemprop="author"> <a href="https://elementor.com/blog/author/anakaric/"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-author"> Ana Karić </span> </a> </li> <li class="elementor-icon-list-item elementor-repeater-item-7c7d22a elementor-inline-item"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom"> on<a href="https://elementor.com/blog/category/stories/" rel="tag">Case Studies</a><a href="https://elementor.com/blog/category/inspiration/" rel="tag">Inspiration</a><a href="https://elementor.com/blog/category/design/" rel="tag">Web Design</a> </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-9be1ce3 elementor-inline-item"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom"> 26.05.21 </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-f31e65b elementor-inline-item"> <span class="elementor-icon-list-icon"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16"><path id="Path" d="M8.433 -0.05 C9.597 -0.052 10.745 0.216 11.788 0.733 12.83 1.251 13.739 2.003 14.441 2.932 15.143 3.86 15.621 4.939 15.835 6.083 16.049 7.227 15.995 8.405 15.676 9.525 15.358 10.645 14.783 11.675 13.999 12.535 13.214 13.395 12.24 14.06 11.154 14.48 10.068 14.899 8.9 15.061 7.741 14.951 6.721 14.855 5.733 14.552 4.837 14.061 L2.294 15.272 C1.232 15.778 0.122 14.669 0.628 13.606 L1.839 11.064 C1.264 10.014 0.948 8.841 0.918 7.641 0.886 6.302 1.212 4.978 1.863 3.807 2.515 2.636 3.468 1.661 4.623 0.983 5.778 0.305 7.094 -0.052 8.433 -0.05 Z M8.433 -0.05 L8.435 -0.05 8.434 0.7 8.432 -0.05 Z M11.121 2.077 C10.286 1.663 9.367 1.448 8.435 1.45 L8.432 1.45 C7.36 1.448 6.307 1.734 5.383 2.277 4.458 2.819 3.695 3.6 3.174 4.536 2.653 5.473 2.392 6.533 2.418 7.604 2.444 8.676 2.757 9.722 3.323 10.632 3.458 10.849 3.474 11.12 3.364 11.351 L2.285 13.615 4.549 12.536 C4.78 12.427 5.051 12.442 5.268 12.577 6.059 13.069 6.954 13.371 7.882 13.458 8.809 13.545 9.745 13.416 10.614 13.08 11.483 12.745 12.263 12.212 12.891 11.524 13.519 10.835 13.979 10.011 14.234 9.114 14.489 8.218 14.532 7.275 14.361 6.359 14.189 5.443 13.807 4.58 13.245 3.837 12.683 3.094 11.956 2.491 11.121 2.077 Z" fill="#000000" fill-opacity="1" stroke="none"></path></svg> </span> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom"> <hyvor-talk-comment-count instance="https://talk.hyvor.com" website-id="10503" page-id="67261" ></hyvor-talk-comment-count> </span> </li> </ul> </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-d16edf2 elementor-section-full_width sc-hero elementor-section-height-default elementor-section-height-default" data-id="d16edf2" data-element_type="section"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4aa6e51" data-id="4aa6e51" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-550667c hero-img-desktop elementor-hidden-mobile elementor-widget elementor-widget-image" data-id="550667c" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img src="https://elementor.com/blog/wp-content/uploads/2022/04/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor_hero-desktop.jpg" title="" alt="" loading="lazy" /> </div> </div> <div class="elementor-element elementor-element-8168e30 elementor-hidden-desktop elementor-hidden-tablet hero-img-mobile elementor-widget elementor-widget-image" data-id="8168e30" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img src="https://elementor.com/blog/wp-content/uploads/2022/04/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor_hero-mobile.jpg" title="" alt="" loading="lazy" /> </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-2c053535 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="2c053535" data-element_type="section" id="article-content"> <div class="elementor-container elementor-column-gap-no"> <article class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-4abf48c2 sticky-area" data-id="4abf48c2" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-f06ed7 elementor-widget__width-initial elementor-widget elementor-widget-theme-post-excerpt" data-id="f06ed7" data-element_type="widget" data-widget_type="theme-post-excerpt.default"> <div class="elementor-widget-container"> For the large Belgrade-based agency OSM, the timing of the Elementor 3.2 release couldn't be better — it was time for a makeover. Learn how their designer used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look. </div> </div> <div class="elementor-element elementor-element-104e4377 elementor-share-buttons--view-icon elementor-share-buttons--skin-flat elementor-share-buttons--color-custom elementor-grid-tablet-0 elementor-share-buttons--align-center elementor-grid-mobile-5 elementor-share-buttons--shape-square elementor-grid-0 elementor-widget elementor-widget-share-buttons" data-id="104e4377" data-element_type="widget" id="share-btn" data-widget_type="share-buttons.default"> <div class="elementor-widget-container"> <div class="elementor-grid"> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_facebook" role="button" tabindex="0" aria-label="Share on facebook" > <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-facebook" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"></path></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_twitter" role="button" tabindex="0" aria-label="Share on twitter" > <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-twitter" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_linkedin" role="button" tabindex="0" aria-label="Share on linkedin" > <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-linkedin" viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_whatsapp" role="button" tabindex="0" aria-label="Share on whatsapp" > <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-whatsapp" viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg"><path d="M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z"></path></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_email" role="button" tabindex="0" aria-label="Share on email" > <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fas-envelope" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></svg> </span> </div> </div> </div> </div> </div> <div class="elementor-element elementor-element-23197770 post-content elementor-widget__width-initial elementor-widget-mobile__width-inherit elementor-widget elementor-widget-theme-post-content" data-id="23197770" data-element_type="widget" data-widget_type="theme-post-content.default"> <div class="elementor-widget-container"> <div data-elementor-type="wp-post" data-elementor-id="67261" class="elementor elementor-67261" data-elementor-post-type="post"> <section class="elementor-section elementor-top-section elementor-element elementor-element-6ae3ca9 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="6ae3ca9" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-973f30a" data-id="973f30a" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-6149493 elementor-widget elementor-widget-text-editor" data-id="6149493" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>We at <a href="https://weareosm.com/" target="_blank" rel="nofollow noopener">OSM</a> are a team of creative, analytical individuals who accomplish awesome things together. Our <em>pack</em> consists of over 50 employees who love to brainstorm, work, and drink coffee together (we are proud of our vintage espresso machine!). </p><p>We’ve been around for over 12 years now, and despite the fact that our team is based in Belgrade, we welcome clients from all over the world. Most of our clients are startups and small businesses, but we have some well-established enterprises in our portfolio, as well. </p><p>As a design and development agency, we consider it important to keep up with the <a href="https://elementor.com/blog/web-design-trends/" rel="dofollow noopener" target="_blank">latest trends</a> and provide our clients with the best possible solutions. Our website has always been our business card: a place where we can show our creativity and provide visitors with an OSM experience. </p><p>Our new site was launched one year ago, and now it is time for a revamp.</p><p>The timing of the <a href="https://elementor.com/blog/introducing-pro-3-2/" rel="dofollow noopener" target="_blank">Elementor 3.2</a> release was just right! <a href="https://generalcondition.com/" target="_blank" rel="nofollow noopener">Jovan Lakić</a>, our main website designer, used <a href="https://elementor.com/widgets/text-path-widget/" rel="dofollow noopener" target="_blank">Text Path Widget</a><strong>, </strong>Mask Option, <a href="https://elementor.com/help/button-widget/" rel="dofollow noopener" target="_blank">gradient buttons</a>, and sticky columns to freshen up our main site’s pages.</p><p>Take a look at what has he done so far:</p> </div> </div> <div class="elementor-element elementor-element-4907993 elementor-widget elementor-widget-video" data-id="4907993" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/OSM-site-revamp-video.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-9d0880c elementor-widget elementor-widget-text-editor" data-id="9d0880c" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>If you are seeking inspiration and guidance on how to make the most out of new <a href="https://elementor.com/" title="Elementor" rel="dofollow noopener" target="_blank">Elementor</a> features — you’re in the right place. My aim for this post is to show how to get these stunning effects without writing a single line of code. But let’s be honest — that’s why you started reading it in the first place, right? 🙂</p><p>Let’s dive right in.</p> </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-7cbf95d9 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="7cbf95d9" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-25a7d601" data-id="25a7d601" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-32ccb170 elementor-align-center elementor-widget elementor-widget-button" data-id="32ccb170" data-element_type="widget" data-gac="CTA_Elements" data-gaa="Link" data-gal="Position_Text_CTA" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://elementor.com/blog/reasons-to-redesign-website/" rel="dofollow noopener" target="_blank"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-text">How To Know if It's Time to Redesign Your Website</span> </span> </a> </div> </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-6b7b6ac elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="6b7b6ac" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-fd1ee4c" data-id="fd1ee4c" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-4315d9a blog-toc elementor-widget elementor-widget-heading" data-id="4315d9a" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Table Of Contents</h2> </div> </div> <div class="elementor-element elementor-element-bc9468e blog-toc elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="bc9468e" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="#wavy-subheadings"> <span class="elementor-icon-list-text">Wavy Subheadings, Thanks to the Text Path Widget</span> </a> </li> <li class="elementor-icon-list-item"> <a href="#how-to-turn-patterns-into-shapes"> <span class="elementor-icon-list-text">How To Turn Patterns Into Shapes With a Gradient Feel</span> </a> </li> <li class="elementor-icon-list-item"> <a href="#the-sticky-column"> <span class="elementor-icon-list-text">Don’t Let Your Visitors Get Lost — The Sticky Column Can Come in Handy!</span> </a> </li> <li class="elementor-icon-list-item"> <a href="#utilize-new-features"> <span class="elementor-icon-list-text">Utilize New Features To Show Creativity!</span> </a> </li> </ul> </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-94e7ae3 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="94e7ae3" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c12c386" data-id="c12c386" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-90de554 elementor-widget elementor-widget-menu-anchor" data-id="90de554" data-element_type="widget" data-widget_type="menu-anchor.default"> <div class="elementor-widget-container"> <div class="elementor-menu-anchor" id="wavy-subheading"></div> </div> </div> <div class="elementor-element elementor-element-e14ca70 elementor-widget elementor-widget-heading" data-id="e14ca70" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Wavy Subheadings, Thanks to the Text Path Widget</h2> </div> </div> <div class="elementor-element elementor-element-9e68919 elementor-widget elementor-widget-text-editor" data-id="9e68919" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>The Website Development Service page is one of the most visited pages on our site, so we wanted it to be more engaging. With the Text Path Widget, we managed to get these stunning, wavy subheadings. Take a look.</p><p><strong>Before:</strong></p> </div> </div> <div class="elementor-element elementor-element-44e80a2 elementor-widget elementor-widget-image" data-id="44e80a2" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img decoding="async" src="https://elementor.com/cdn-cgi/image/f=auto,w=600,h=224/https://elementor.com/blog/wp-content/uploads/elementor/thumbs/text-path-before-p7q28b5z5c9beyilg441vn36a8v4uhsmwv18t847ze.png" title="Text-Path-Before" alt="Text Path Before P7Q28B5Z5C9Beyilg441Vn36A8V4Uhsmwv18T847Ze How A Leading Design Agency Revamped Their Website With Elementor 1" loading="lazy"> </div> </div> <div class="elementor-element elementor-element-d37fae8 elementor-widget elementor-widget-text-editor" data-id="d37fae8" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p><strong>After:</strong></p> </div> </div> <div class="elementor-element elementor-element-eae094f elementor-widget elementor-widget-image" data-id="eae094f" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img fetchpriority="high" fetchpriority="high" decoding="async" width="600" height="224" src="https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-CTA.gif" class="attachment-full size-full wp-image-67274" alt="Gradient Cta How A Leading Design Agency Revamped Their Website With Elementor 2" title="Gradient Cta How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-e9063c8 elementor-widget elementor-widget-heading" data-id="e9063c8" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h3 class="elementor-heading-title elementor-size-default">How Can You Create a Wavy Text Like This One </h3> </div> </div> <div class="elementor-element elementor-element-c185a9c elementor-widget elementor-widget-text-editor" data-id="c185a9c" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>1. In the Elementor editor — search for the <strong>Text Path</strong> widget and drag it in:</p> </div> </div> <div class="elementor-element elementor-element-af328b7 elementor-widget elementor-widget-image" data-id="af328b7" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" decoding="async" width="300" height="219" src="https://elementor.com/cdn-cgi/image/f=auto,w=300,h=219/https://elementor.com/blog/wp-content/uploads/2021/05/text-path-widget-300x219.png" class="attachment-medium size-medium wp-image-67281" alt="Text Path Widget How A Leading Design Agency Revamped Their Website With Elementor 3" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/text-path-widget-300x219.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=600/https://elementor.com/blog/wp-content/uploads/2021/05/text-path-widget.png 600w" sizes="(max-width: 300px) 100vw, 300px" title="Text Path Widget How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-d0e61bd elementor-widget elementor-widget-text-editor" data-id="d0e61bd" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>2. Replace the placeholder text with your own. </p><p>3. In the <strong>Style</strong> tab, adjust the Font Family, Size, and Color.</p><p>4. Click the <strong>Show Path</strong> toggle, so you can better visualize your text path. You can switch it off later if necessary.</p><p>5. Choose an option in the <strong>Path Type</strong>. We’ve opted for “Wave<em>”. </em>If you want an even more curvy look, you can always choose the Custom option. Simply by clicking on the <strong><em>+</em></strong> button, upload a curve that you’ve previously drawn or downloaded:</p> </div> </div> <div class="elementor-element elementor-element-664dd9d elementor-widget elementor-widget-image" data-id="664dd9d" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" decoding="async" width="251" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=251,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/upload-SVG-251x300.png" class="attachment-medium size-medium wp-image-67291" alt="Upload Svg How A Leading Design Agency Revamped Their Website With Elementor 4" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=251/https://elementor.com/blog/wp-content/uploads/2021/05/upload-SVG-251x300.png 251w, https://elementor.com/cdn-cgi/image/f=auto,w=582/https://elementor.com/blog/wp-content/uploads/2021/05/upload-SVG.png 582w" sizes="(max-width: 251px) 100vw, 251px" title="Upload Svg How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-8f09b76 elementor-widget elementor-widget-text-editor" data-id="8f09b76" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>6. Align the positioning of the Text Path widget — we’ve chosen to align it to Center. The default widget size of 500 pixels takes up the whole column — so you might not be able to see the alignment change before you change the size.</p><p>7. Choose a <strong>Text Direction</strong>. We’ve mixed things up a bit so that the first line of text is LTR (left-to-right), and the second one is RTL (right-to-left):</p> </div> </div> <div class="elementor-element elementor-element-fc71a8f elementor-widget elementor-widget-image" data-id="fc71a8f" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="194" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=194,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/edit-text-path-widget-194x300.png" class="attachment-medium size-medium wp-image-67298" alt="Edit Text Path Widget How A Leading Design Agency Revamped Their Website With Elementor 5" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=194/https://elementor.com/blog/wp-content/uploads/2021/05/edit-text-path-widget-194x300.png 194w, https://elementor.com/cdn-cgi/image/f=auto,w=600/https://elementor.com/blog/wp-content/uploads/2021/05/edit-text-path-widget.png 600w" sizes="(max-width: 194px) 100vw, 194px" title="Edit Text Path Widget How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-de5cf3f elementor-widget elementor-widget-text-editor" data-id="de5cf3f" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Simple as that!</p><p>Here are more examples of how we used this neat feature.</p><p><b>Before:</b></p> </div> </div> <div class="elementor-element elementor-element-fe9cddf elementor-widget elementor-widget-image" data-id="fe9cddf" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img decoding="async" src="https://elementor.com/blog/wp-content/uploads/elementor/thumbs/Before-1-p7q3tfsuiugp1rj7ut3rf83q1ba8o8lc3mfmuneuok.png" title="Before-1" alt="Before 1 P7Q3Tfsuiugp1Rj7Ut3Rf83Q1Ba8O8Lc3Mfmuneuok How A Leading Design Agency Revamped Their Website With Elementor 6" loading="lazy"> </div> </div> <div class="elementor-element elementor-element-e46797f elementor-widget elementor-widget-image" data-id="e46797f" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img decoding="async" src="https://elementor.com/blog/wp-content/uploads/elementor/thumbs/Before-2-p7q3twpxxv3uuqun40f1o3u0q8yuisgi5y6dhmprka.png" title="Before-2" alt="Before 2 How A Leading Design Agency Revamped Their Website With Elementor 7" loading="lazy"> </div> </div> <div class="elementor-element elementor-element-14a1031 elementor-widget elementor-widget-text-editor" data-id="14a1031" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p><strong>After:</strong></p> </div> </div> <div class="elementor-element elementor-element-cc5bff2 elementor-widget elementor-widget-video" data-id="cc5bff2" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/After-wavy-subheadings.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-880ca5f elementor-widget elementor-widget-menu-anchor" data-id="880ca5f" data-element_type="widget" data-widget_type="menu-anchor.default"> <div class="elementor-widget-container"> <div class="elementor-menu-anchor" id="how-to-turn-patterns-into-shapes"></div> </div> </div> <div class="elementor-element elementor-element-b75b654 elementor-widget elementor-widget-heading" data-id="b75b654" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">How To Turn Patterns Into Shapes With a Gradient Feel </h2> </div> </div> <div class="elementor-element elementor-element-15e3d1d elementor-widget elementor-widget-text-editor" data-id="15e3d1d" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Creating patterns with shapes is a cliché. Let’s go the other way around.</p><p>We must brag a bit, and say that everyone was wowed by the patterns on our Homepage.</p><p><strong>Before:</strong></p> </div> </div> <div class="elementor-element elementor-element-4155af8 elementor-widget elementor-widget-video" data-id="4155af8" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/osm-patterns.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-4d52e2a elementor-widget elementor-widget-text-editor" data-id="4d52e2a" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>However, we did a bit of a pattern makeover after playing with the <strong>Mask</strong> feature. How do you like our patterns’ new look?</p><p><strong>After:</strong></p> </div> </div> <div class="elementor-element elementor-element-a2cec98 elementor-widget elementor-widget-image" data-id="a2cec98" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="720" height="448" src="https://elementor.com/cdn-cgi/image/f=auto,w=720,h=448/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-3.png" class="attachment-full size-full wp-image-67326" alt="Screenshot 3 How A Leading Design Agency Revamped Their Website With Elementor 8" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=720/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-3.png 720w, https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-3-300x187.png 300w" sizes="(max-width: 720px) 100vw, 720px" title="Screenshot 3 How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-9f0fcc8 elementor-widget elementor-widget-image" data-id="9f0fcc8" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="720" height="474" src="https://elementor.com/cdn-cgi/image/f=auto,w=720,h=474/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-4.png" class="attachment-full size-full wp-image-67327" alt="Screenshot 4 How A Leading Design Agency Revamped Their Website With Elementor 9" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=720/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-4.png 720w, https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-4-300x198.png 300w" sizes="(max-width: 720px) 100vw, 720px" title="Screenshot 4 How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-9976d9f elementor-widget elementor-widget-image" data-id="9976d9f" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="720" height="459" src="https://elementor.com/cdn-cgi/image/f=auto,w=720,h=459/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-5.png" class="attachment-full size-full wp-image-67328" alt="Screenshot 5 How A Leading Design Agency Revamped Their Website With Elementor 10" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=720/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-5.png 720w, https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/screenshot-5-300x191.png 300w" sizes="(max-width: 720px) 100vw, 720px" title="Screenshot 5 How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-ca574bd elementor-widget elementor-widget-heading" data-id="ca574bd" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h3 class="elementor-heading-title elementor-size-default">How To Use the Mask Option To Create Shapes Like These </h3> </div> </div> <div class="elementor-element elementor-element-4234650 elementor-widget elementor-widget-text-editor" data-id="4234650" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>1. Drag the <a href="https://elementor.com/help/image-widget/" rel="dofollow noopener" target="_blank">Image Widget</a> from the Editor and upload your image of choice (or a pattern, like in our case).</p><p>2. Find the <strong>Mask</strong> option in the <strong>Advanced</strong> tab and click to toggle it on:</p> </div> </div> <div class="elementor-element elementor-element-e5c4a18 elementor-widget elementor-widget-image" data-id="e5c4a18" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="146" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=146,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-widget-146x300.png" class="attachment-medium size-medium wp-image-67338" alt="Mask Widget How A Leading Design Agency Revamped Their Website With Elementor 11" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=146/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-widget-146x300.png 146w, https://elementor.com/cdn-cgi/image/f=auto,w=499/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-widget-499x1024.png 499w, https://elementor.com/cdn-cgi/image/f=auto,w=598/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-widget.png 598w" sizes="(max-width: 146px) 100vw, 146px" title="Mask Widget How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-a334280 elementor-widget elementor-widget-text-editor" data-id="a334280" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>3. Choose a Shape from the list (we used “Blob”), or upload your own <a href="https://elementor.com/blog/svg/" title="SVG" rel="dofollow noopener" target="_blank">SVG</a> or PNG format:</p> </div> </div> <div class="elementor-element elementor-element-0ba6eb2 elementor-widget elementor-widget-image" data-id="0ba6eb2" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="300" height="267" src="https://elementor.com/cdn-cgi/image/f=auto,w=300,h=267/https://elementor.com/blog/wp-content/uploads/2021/05/Blob-shape-300x267.png" class="attachment-medium size-medium wp-image-67339" alt="Blob Shape How A Leading Design Agency Revamped Their Website With Elementor 12" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/Blob-shape-300x267.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=582/https://elementor.com/blog/wp-content/uploads/2021/05/Blob-shape.png 582w" sizes="(max-width: 300px) 100vw, 300px" title="Blob Shape How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-974225e elementor-widget elementor-widget-text-editor" data-id="974225e" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>4. Set the size of the Mask to specify how it should fit its container. Go for either the “Fit” or “Fill” option, or play with the mask size in the <strong>Custom Size</strong> section:</p> </div> </div> <div class="elementor-element elementor-element-679e09c elementor-widget elementor-widget-image" data-id="679e09c" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="300" height="266" src="https://elementor.com/cdn-cgi/image/f=auto,w=300,h=266/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-size-300x266.png" class="attachment-medium size-medium wp-image-67346" alt="Mask Size How A Leading Design Agency Revamped Their Website With Elementor 13" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-size-300x266.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=574/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-size.png 574w" sizes="(max-width: 300px) 100vw, 300px" title="Mask Size How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-540bf11 elementor-widget elementor-widget-text-editor" data-id="540bf11" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>5. Tweak the mask for different screens (tablet, mobile) by clicking on the device icons:</p> </div> </div> <div class="elementor-element elementor-element-23f5fc0 elementor-widget elementor-widget-image" data-id="23f5fc0" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="300" height="270" src="https://elementor.com/cdn-cgi/image/f=auto,w=300,h=270/https://elementor.com/blog/wp-content/uploads/2021/05/different-device-mask-300x270.png" class="attachment-medium size-medium wp-image-67350" alt="Different Device Mask How A Leading Design Agency Revamped Their Website With Elementor 14" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/different-device-mask-300x270.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=586/https://elementor.com/blog/wp-content/uploads/2021/05/different-device-mask.png 586w" sizes="(max-width: 300px) 100vw, 300px" title="Different Device Mask How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-f6bb603 elementor-widget elementor-widget-text-editor" data-id="f6bb603" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>6. Add some <a href="https://elementor.com/help/motion-effects/" rel="dofollow noopener" target="_blank">Motion Effects</a> to make your design even more fun! Select the Scrolling Effects or Mouse Effects toggles to turn the animation on and pick the effect that you like:</p> </div> </div> <div class="elementor-element elementor-element-f61a747 elementor-widget elementor-widget-image" data-id="f61a747" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="157" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=157,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-animation-157x300.png" class="attachment-medium size-medium wp-image-67351" alt="Mask Animation How A Leading Design Agency Revamped Their Website With Elementor 15" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=157/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-animation-157x300.png 157w, https://elementor.com/cdn-cgi/image/f=auto,w=537/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-animation-537x1024.png 537w, https://elementor.com/cdn-cgi/image/f=auto,w=594/https://elementor.com/blog/wp-content/uploads/2021/05/Mask-animation.png 594w" sizes="(max-width: 157px) 100vw, 157px" title="Mask Animation How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-9fa82a3 elementor-widget elementor-widget-text-editor" data-id="9fa82a3" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>That’s it!</p><p>Ah, one more thing — have you noticed our revamped CTA buttons? We’ve added the gradient button effect to make them more engaging. After all, 2021 design trends are very much about gradients.</p><p>The buttons on our current website just have a frame with a solid color <a href="https://elementor.com/help/hover-effects/" rel="dofollow noopener" target="_blank">hover state</a>.</p><p><strong>Before:</strong></p> </div> </div> <div class="elementor-element elementor-element-543e6ba elementor-widget elementor-widget-image" data-id="543e6ba" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="597" height="188" src="https://elementor.com/blog/wp-content/uploads/2021/05/Old-CTAs.gif" class="attachment-large size-large wp-image-67365" alt="Old Ctas How A Leading Design Agency Revamped Their Website With Elementor 16" title="Old Ctas How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-af68be5 elementor-widget elementor-widget-text-editor" data-id="af68be5" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p><strong>After:</strong></p> </div> </div> <div class="elementor-element elementor-element-41d10c1 elementor-widget elementor-widget-video" data-id="41d10c1" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/Gradient-CTA-1.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-0a5ac21 elementor-widget elementor-widget-heading" data-id="0a5ac21" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h3 class="elementor-heading-title elementor-size-default">How To Add the Gradient Button Effect to Your Button </h3> </div> </div> <div class="elementor-element elementor-element-0d80769 elementor-widget elementor-widget-text-editor" data-id="0d80769" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>1. Go to the <strong>Style</strong> tab and click the Gradient icon in the <strong>Background Type</strong> option to turn the solid color background into a gradient background:</p> </div> </div> <div class="elementor-element elementor-element-7afacdd elementor-widget elementor-widget-image" data-id="7afacdd" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="240" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=240,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-icon-240x300.png" class="attachment-medium size-medium wp-image-67380" alt="Gradient Icon How A Leading Design Agency Revamped Their Website With Elementor 17" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=240/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-icon-240x300.png 240w, https://elementor.com/cdn-cgi/image/f=auto,w=600/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-icon.png 600w" sizes="(max-width: 240px) 100vw, 240px" title="Gradient Icon How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-1227e1a elementor-widget elementor-widget-text-editor" data-id="1227e1a" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>2. Pick two colors and adjust the location of each one. That way, you can control the transition between the gradient, and how sharp or subtle it’ll be.</p> </div> </div> <div class="elementor-element elementor-element-dacf540 elementor-widget elementor-widget-image" data-id="dacf540" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="298" height="300" src="https://elementor.com/cdn-cgi/image/f=auto,w=298,h=300/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-location-298x300.png" class="attachment-medium size-medium wp-image-67381" alt="Gradient Location How A Leading Design Agency Revamped Their Website With Elementor 18" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=298/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-location-298x300.png 298w, https://elementor.com/cdn-cgi/image/f=auto,w=150/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-location-150x150.png 150w, https://elementor.com/cdn-cgi/image/f=auto,w=592/https://elementor.com/blog/wp-content/uploads/2021/05/Gradient-location.png 592w" sizes="(max-width: 298px) 100vw, 298px" title="Gradient Location How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-07c6ec3 elementor-widget elementor-widget-text-editor" data-id="07c6ec3" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>3. Choose the Gradient Type: “Linear” or “Radiant”. We implemented the linear one, but you should test and decide on the best fit for your website design.</p> </div> </div> <div class="elementor-element elementor-element-dbed966 elementor-widget elementor-widget-image" data-id="dbed966" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" loading="lazy" decoding="async" width="300" height="94" src="https://elementor.com/cdn-cgi/image/f=auto,w=300,h=94/https://elementor.com/blog/wp-content/uploads/2021/05/Linear-gradient-300x94.png" class="attachment-medium size-medium wp-image-67382" alt="Linear Gradient How A Leading Design Agency Revamped Their Website With Elementor 19" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2021/05/Linear-gradient-300x94.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=558/https://elementor.com/blog/wp-content/uploads/2021/05/Linear-gradient.png 558w" sizes="(max-width: 300px) 100vw, 300px" title="Linear Gradient How A Leading Design Agency Revamped Their Website With Elementor"> </div> </div> <div class="elementor-element elementor-element-f344518 elementor-widget elementor-widget-text-editor" data-id="f344518" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>4. Use the slider or type in an exact value to adjust the gradient “Angle”.</p><p>5. Add a hover effect to make the button more interactive.</p> </div> </div> <div class="elementor-element elementor-element-f529b07 elementor-widget elementor-widget-menu-anchor" data-id="f529b07" data-element_type="widget" data-widget_type="menu-anchor.default"> <div class="elementor-widget-container"> <div class="elementor-menu-anchor" id="the-sticky-column"></div> </div> </div> <div class="elementor-element elementor-element-605f004 elementor-widget elementor-widget-heading" data-id="605f004" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Don’t Let Your Visitors Get Lost — The Sticky Column Can Come in Handy!</h2> </div> </div> <div class="elementor-element elementor-element-b84f291 elementor-widget elementor-widget-text-editor" data-id="b84f291" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>It’s often the case that when visitors scroll down a page, they simply forget why they were on the page in the first place. Even if this isn’t the case, imagine how useful it would be to have sticky sub-headings or important info. This is something we’ve tested on our Brand Development page. Check it out.</p><p><strong> Before:</strong></p> </div> </div> <div class="elementor-element elementor-element-dfa8f38 elementor-widget elementor-widget-video" data-id="dfa8f38" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/Sticky-effect-before.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-94bbe60 elementor-widget elementor-widget-text-editor" data-id="94bbe60" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p><strong>After:</strong></p> </div> </div> <div class="elementor-element elementor-element-962ba60 elementor-widget elementor-widget-video" data-id="962ba60" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/Sticky-colums-after.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-e979ac5 elementor-widget elementor-widget-heading" data-id="e979ac5" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h3 class="elementor-heading-title elementor-size-default">How To Implement the Sticky Column </h3> </div> </div> <div class="elementor-element elementor-element-4680a99 elementor-widget elementor-widget-text-editor" data-id="4680a99" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>1. Select the <strong>Inner Section</strong> widget (within the main one) and go to the <strong>Advanced</strong> tab.</p><p>2. In the <strong>Motion Effects</strong> section, choose the Sticky effect -> Top.</p><p>3. In the <strong>Offset,</strong> add the value 100 (0 is the default).</p><p>4. Select “Stay in Column”<em>. </em>This means that the inner column remains within the main section.</p> </div> </div> <div class="elementor-element elementor-element-1b3a2f4 elementor-widget elementor-widget-video" data-id="1b3a2f4" data-element_type="widget" data-settings="{"video_type":"hosted","autoplay":"yes","play_on_mobile":"yes","mute":"yes","loop":"yes"}" data-widget_type="video.default"> <div class="elementor-widget-container"> <div class="e-hosted-video elementor-wrapper elementor-open-inline"> <video class="elementor-video" src="https://elementor.com/marketing/wp-content/uploads/sites/9/2021/05/sticky.mp4" autoplay="" loop="" muted="muted" playsinline="" controlsList="nodownload"></video> </div> </div> </div> <div class="elementor-element elementor-element-ea4b3ec elementor-widget elementor-widget-text-editor" data-id="ea4b3ec" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Not that hard, right?</p> </div> </div> <div class="elementor-element elementor-element-f5fba76 elementor-widget elementor-widget-menu-anchor" data-id="f5fba76" data-element_type="widget" data-widget_type="menu-anchor.default"> <div class="elementor-widget-container"> <div class="elementor-menu-anchor" id="utilize-new-features"></div> </div> </div> <div class="elementor-element elementor-element-87827da elementor-widget elementor-widget-heading" data-id="87827da" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Utilize New Features To Show Creativity! </h2> </div> </div> <div class="elementor-element elementor-element-eed60c9 elementor-widget elementor-widget-text-editor" data-id="eed60c9" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Hope that we’ve encouraged you to explore Elementor 3.2., and to play with these cool features we’ve described. We are still in the process of updating our website and can’t wait to see what you’ve come up with for yours — maybe we can get even more ideas! Let us know in the comments down below.</p> </div> </div> </div> </div> </div> </section> </div> </div> </div> </div> </article> <div class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-11197da1 share-icons" data-id="11197da1" data-element_type="column"> <div class="elementor-widget-wrap"> </div> </div> <div class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-4f5c9e19 stop-banner" data-id="4f5c9e19" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-47706fa7 elementor-cta--skin-classic elementor-animated-content elementor-bg-transform elementor-bg-transform-zoom-in elementor-widget elementor-widget-call-to-action" data-id="47706fa7" data-element_type="widget" data-widget_type="call-to-action.default"> <div class="elementor-widget-container"> <div class="elementor-cta"> <div class="elementor-cta__content"> <h5 class="elementor-cta__title elementor-cta__content-item elementor-content-item"> Looking for fresh content? </h5> <div class="elementor-cta__description elementor-cta__content-item elementor-content-item"> Get articles and insights from our weekly newsletter. </div> </div> </div> </div> </div> <div class="elementor-element elementor-element-3544a42 elementor-widget__width-initial elementor-widget-mobile__width-inherit newsletter-signup-form elementor-button-align-stretch elementor-widget elementor-widget-form" data-id="3544a42" data-element_type="widget" data-settings="{"step_next_label":"Next","step_previous_label":"Previous","additional_attributes":[{"_id":"d23a634","attr_key":"newsletter_subscriber","attr_value":"true"}],"button_width":"30","button_width_mobile":"30","step_type":"number_text","step_icon_shape":"circle"}" data-widget_type="form.default"> <div class="elementor-widget-container"> <form class="elementor-form" method="post" action="https://form.strattic.com/forms/6a3492a3-66ce-43e7-9502-13c8bda200f5" id="elementor_newsletter_subscribe" name="Newsletter roll"> <input type="hidden" name="post_id" value="79012"/> <input type="hidden" name="form_id" value="3544a42"/> <input type="hidden" name="referer_title" value="How A Leading Design Agency Revamped Their Website With Elementor | Elementor" /> <input type="hidden" name="queried_id" value="67261"/> <div class="elementor-form-fields-wrapper elementor-labels-"> <div class="elementor-field-type-email elementor-field-group elementor-column elementor-field-group-email elementor-col-70 elementor-sm-70 elementor-field-required"> <label for="form-field-email" class="elementor-field-label elementor-screen-only"> Email </label> <input size="1" type="email" name="form_fields[email]" id="form-field-email" class="elementor-field elementor-size-sm elementor-field-textual" placeholder="Enter your email address" required="required" aria-required="true"> </div> <div class="elementor-field-type-hidden elementor-field-group elementor-column elementor-field-group-newsletter_subscribe elementor-col-100"> <input size="1" type="hidden" name="form_fields[newsletter_subscribe]" id="form-field-newsletter_subscribe" class="elementor-field elementor-size-sm elementor-field-textual" value="elementor_newsletter_subscribe"> </div> <div class="elementor-field-group elementor-column elementor-field-type-submit elementor-col-30 e-form__buttons elementor-sm-30"> <button class="elementor-button elementor-size-sm" type="submit"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-text">Subscribe</span> </span> </button> </div> </div> </form> </div> </div> <div class="elementor-element elementor-element-2486a9ca elementor-widget-mobile__width-inherit elementor-widget elementor-widget-text-editor" data-id="2486a9ca" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> By entering your email, you agree to our <a href="https://elementor.com/blog/terms/" target="_blank" aria-label="Read our Terms of Service" rel="noopener">Terms of Service </a> and <a href="https://elementor.com/blog/about/privacy/" target="_blank" aria-label="Read our Privacy Policy" rel="noopener">Privacy Policy</a>. </div> </div> </div> </div> </div> </section> <section class="elementor-section elementor-top-section elementor-element elementor-element-3641ed6f color-bg blog-author elementor-section-height-min-height elementor-section-boxed elementor-section-height-default elementor-section-items-middle" data-id="3641ed6f" data-element_type="section"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-465bdb32" data-id="465bdb32" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-3960f2f9 elementor-author-box--layout-image-left elementor-author-box--align-left elementor-author-box--image-valign-top elementor-author-box--avatar-yes elementor-author-box--name-yes elementor-author-box--biography-yes elementor-widget elementor-widget-author-box" data-id="3960f2f9" data-element_type="widget" data-widget_type="author-box.default"> <div class="elementor-widget-container"> <div class="elementor-author-box"> <div class="elementor-author-box__avatar"> <img src="https://secure.gravatar.com/avatar/ceb5981bb52dd7fd2f4c029f65693b83?s=300&d=mm&r=g" alt="Picture of Ana Karić" loading="lazy"> </div> <div class="elementor-author-box__text"> <div > <div class="elementor-author-box__name"> Ana Karić </div> </div> <div class="elementor-author-box__bio"> Ana Karić is part of the OSM team, where she works as Head of Marketing. Her aim is to use proven Growth Marketing frameworks and strategies to help businesses scale. She tends to keep a holistic approach to her work, so exploring website crafting with Elementor was the logical step to take...and she is loving it! </div> </div> </div> </div> </div> </div> </div> </div> </section> <aside class="elementor-section elementor-top-section elementor-element elementor-element-4e3612c3 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="4e3612c3" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-50e5ed1f" data-id="50e5ed1f" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-288175bc elementor-widget elementor-widget-heading" data-id="288175bc" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h5 class="elementor-heading-title elementor-size-default">You might also like</h5> </div> </div> <div class="elementor-element elementor-element-929f46f elementor-grid-2 elementor-grid-tablet-2 elementor-grid-mobile-1 elementor-widget elementor-widget-loop-grid" data-id="929f46f" data-element_type="widget" data-settings="{"template_id":86535,"columns":2,"_skin":"post","columns_tablet":"2","columns_mobile":"1","edit_handle_selector":"[data-elementor-type=\"loop-item\"]","row_gap":{"unit":"px","size":"","sizes":[]},"row_gap_tablet":{"unit":"px","size":"","sizes":[]},"row_gap_mobile":{"unit":"px","size":"","sizes":[]}}" data-widget_type="loop-grid.post"> <div class="elementor-widget-container"> <div class="elementor-loop-container elementor-grid"> <style id="loop-86535">.elementor-86535 .elementor-element.elementor-element-6ad62c5{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--gap:24px 24px;--grid-auto-flow:row;--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-86535 .elementor-element.elementor-element-a6d9aff{--display:flex;--justify-content:center;--gap:0px 12px;--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-86535 .elementor-element.elementor-element-7d321b6 .elementor-heading-title{color:var( --e-global-color-3577440 );font-family:"Oli Grotesk", Sans-serif;font-size:19px;font-weight:600;line-height:1.2em;}.elementor-86535 .elementor-element.elementor-element-7d321b6 > .elementor-widget-container{padding:0px 0px 12px 0px;}.elementor-86535 .elementor-element.elementor-element-af2fe6e .elementor-widget-container{color:var( --e-global-color-3577440 );font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:400;}.elementor-86535 .elementor-element.elementor-element-af2fe6e > .elementor-widget-container{margin:0px 0px 12px 0px;}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-bottom:calc(12px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-top:calc(12px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-right:calc(12px/2);margin-left:calc(12px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items{margin-right:calc(-12px/2);margin-left:calc(-12px/2);}body.rtl .elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{left:calc(-12px/2);}body:not(.rtl) .elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{right:calc(-12px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-icon{width:14px;}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-icon i{font-size:14px;}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-text, .elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-text a{color:var( --e-global-color-bbe3b7c );}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-item{font-family:"DM Sans", Sans-serif;font-size:14px;font-weight:bold;}.elementor-86535 .elementor-element.elementor-element-d355311 > .elementor-widget-container{padding:6px 0px 0px 0px;}@media(max-width:1024px){.elementor-86535 .elementor-element.elementor-element-6ad62c5{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-86535 .elementor-element.elementor-element-6ad62c5{--e-con-grid-template-columns:1;--e-con-grid-template-rows:repeat(1, 1fr);--gap:24px 24px;--grid-auto-flow:row;}.elementor-86535 .elementor-element.elementor-element-02618c4.elementor-element{--order:-99999 /* order start hack */;}.elementor-86535 .elementor-element.elementor-element-7d321b6 .elementor-heading-title{font-size:19px;}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-bottom:calc(8px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-top:calc(8px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-right:calc(8px/2);margin-left:calc(8px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items{margin-right:calc(-8px/2);margin-left:calc(-8px/2);}body.rtl .elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{left:calc(-8px/2);}body:not(.rtl) .elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{right:calc(-8px/2);}.elementor-86535 .elementor-element.elementor-element-d355311 .elementor-icon-list-item{font-size:12px;letter-spacing:-0.3px;}}/* Start custom CSS for theme-post-excerpt, class: .elementor-element-af2fe6e */@media (max-width: 767px) { .elementor-86535 .elementor-element.elementor-element-af2fe6e { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } }/* End custom CSS */</style> <div data-elementor-type="loop-item" data-elementor-id="86535" class="elementor elementor-86535 e-loop-item e-loop-item-119528 post-119528 post type-post status-publish format-standard has-post-thumbnail hentry category-elementor category-new-features tag-video" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-6ad62c5 e-grid e-con-boxed e-con e-parent" data-id="6ad62c5" data-element_type="container"> <div class="e-con-inner"> <div class="elementor-element elementor-element-02618c4 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image" data-id="02618c4" data-element_type="widget" data-widget_type="theme-post-featured-image.default"> <div class="elementor-widget-container"> <a href="https://elementor.com/blog/elementor-325-css-loading-anchor-offset-search-pagination/"> <img loading="lazy" width="1200" height="630" src="https://elementor.com/cdn-cgi/image/f=auto,w=1200,h=630/https://elementor.com/blog/wp-content/uploads/2024/11/cover.png" class="attachment-full size-full wp-image-119514" alt="" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=1200/https://elementor.com/blog/wp-content/uploads/2024/11/cover.png 1200w, https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2024/11/cover-300x158.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=1024/https://elementor.com/blog/wp-content/uploads/2024/11/cover-1024x538.png 1024w, https://elementor.com/cdn-cgi/image/f=auto,w=768/https://elementor.com/blog/wp-content/uploads/2024/11/cover-768x403.png 768w" sizes="(max-width: 1200px) 100vw, 1200px" /> </a> </div> </div> <div class="elementor-element elementor-element-a6d9aff e-con-full e-flex e-con e-child" data-id="a6d9aff" data-element_type="container"> <div class="elementor-element elementor-element-7d321b6 elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading" data-id="7d321b6" data-element_type="widget" data-widget_type="theme-post-title.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default"><a href="https://elementor.com/blog/elementor-325-css-loading-anchor-offset-search-pagination/">New in Elementor 3.25: CSS Optimization, New Anchor Offset Control & Pagination Options for Live Results in the Search widget!</a></h2> </div> </div> <div class="elementor-element elementor-element-af2fe6e elementor-widget elementor-widget-theme-post-excerpt" data-id="af2fe6e" data-element_type="widget" data-widget_type="theme-post-excerpt.default"> <div class="elementor-widget-container"> Boost your site’s speed with further CSS optimization, enjoy smooth scrolling with native CSS and Anchor Offset, and enhance search functionality with pagination... </div> </div> <div class="elementor-element elementor-element-d355311 elementor-widget elementor-widget-post-info" data-id="d355311" data-element_type="widget" data-widget_type="post-info.default"> <div class="elementor-widget-container"> <ul class="elementor-inline-items elementor-icon-list-items elementor-post-info"> <li class="elementor-icon-list-item elementor-repeater-item-6239d4b elementor-inline-item" itemprop="author"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-author"> Roi Tal </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-604839e elementor-inline-item" itemprop="datePublished"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-date"> <span class="elementor-post-info__item-prefix">Created: </span> <time>Nov 03, 2024</time> </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-8e234fd elementor-inline-item"> <span class="elementor-icon-list-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.34704 1.56056C9.27796 1.55896 10.1965 1.77351 11.0304 2.18731C11.8646 2.60125 12.5913 3.20327 13.1532 3.94592C13.7151 4.68858 14.0968 5.55158 14.2683 6.46691C14.4398 7.38224 14.3964 8.3249 14.1414 9.22059C13.8865 10.1163 13.4271 10.9405 12.7993 11.6284C12.1715 12.3162 11.3926 12.8489 10.5238 13.1844C9.65511 13.5199 8.72033 13.649 7.79318 13.5617C6.97713 13.4848 6.18662 13.242 5.46968 12.8495L3.43585 13.8184C2.58567 14.2234 1.69807 13.336 2.10291 12.4857L3.07148 10.4515C2.6118 9.6121 2.35857 8.67344 2.33509 7.7135C2.30888 6.64194 2.56991 5.5829 3.09109 4.64626C3.61228 3.70963 4.37462 2.92954 5.29901 2.38694C6.22312 1.84451 7.27551 1.55919 8.34704 1.56056ZM10.497 3.26224C9.8293 2.9309 9.09373 2.75916 8.3483 2.76056H8.34631C7.48859 2.75932 6.64617 2.98764 5.90647 3.42183C5.16677 3.85602 4.55674 4.48025 4.13969 5.22975C3.72263 5.97924 3.51376 6.82669 3.53473 7.68415C3.5557 8.54161 3.80576 9.37784 4.25896 10.106C4.36701 10.2797 4.37919 10.4964 4.29128 10.681L3.42871 12.4926L5.23992 11.6298C5.42453 11.5419 5.64121 11.554 5.81485 11.662C6.44783 12.0557 7.1636 12.297 7.90575 12.367C8.6479 12.4369 9.39615 12.3335 10.0915 12.065C10.7869 11.7964 11.4104 11.37 11.9129 10.8194C12.4154 10.2688 12.7832 9.60906 12.9873 8.8921C13.1913 8.17514 13.2261 7.42058 13.0888 6.68789C12.9515 5.95521 12.646 5.26441 12.1962 4.66994C11.7465 4.07548 11.1648 3.59359 10.497 3.26224Z" fill="black"></path></svg> </span> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom"> <hyvor-talk-comment-count instance="https://talk.hyvor.com" website-id="10503" page-id="119528" ></hyvor-talk-comment-count> </span> </li> </ul> </div> </div> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="86535" class="elementor elementor-86535 e-loop-item e-loop-item-119348 post-119348 post type-post status-publish format-standard has-post-thumbnail hentry category-woocommerce category-hosting category-marketing tag-banner-ecommerce tag-banner-exclude-default" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-6ad62c5 e-grid e-con-boxed e-con e-parent" data-id="6ad62c5" data-element_type="container"> <div class="e-con-inner"> <div class="elementor-element elementor-element-02618c4 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image" data-id="02618c4" data-element_type="widget" data-widget_type="theme-post-featured-image.default"> <div class="elementor-widget-container"> <a href="https://elementor.com/blog/prepare-your-store-black-friday-tips/"> <img loading="lazy" width="1200" height="630" src="https://elementor.com/cdn-cgi/image/f=auto,w=1200,h=630/https://elementor.com/blog/wp-content/uploads/2024/10/COVER-3.png" class="attachment-full size-full wp-image-119349" alt="" srcset="https://elementor.com/cdn-cgi/image/f=auto,w=1200/https://elementor.com/blog/wp-content/uploads/2024/10/COVER-3.png 1200w, https://elementor.com/cdn-cgi/image/f=auto,w=300/https://elementor.com/blog/wp-content/uploads/2024/10/COVER-3-300x158.png 300w, https://elementor.com/cdn-cgi/image/f=auto,w=1024/https://elementor.com/blog/wp-content/uploads/2024/10/COVER-3-1024x538.png 1024w, https://elementor.com/cdn-cgi/image/f=auto,w=768/https://elementor.com/blog/wp-content/uploads/2024/10/COVER-3-768x403.png 768w" sizes="(max-width: 1200px) 100vw, 1200px" /> </a> </div> </div> <div class="elementor-element elementor-element-a6d9aff e-con-full e-flex e-con e-child" data-id="a6d9aff" data-element_type="container"> <div class="elementor-element elementor-element-7d321b6 elementor-widget elementor-widget-theme-post-title elementor-page-title elementor-widget-heading" data-id="7d321b6" data-element_type="widget" data-widget_type="theme-post-title.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default"><a href="https://elementor.com/blog/prepare-your-store-black-friday-tips/">Prepare Your Store for Black Friday: 8 Essential Tips for a Successful Sale</a></h2> </div> </div> <div class="elementor-element elementor-element-af2fe6e elementor-widget elementor-widget-theme-post-excerpt" data-id="af2fe6e" data-element_type="widget" data-widget_type="theme-post-excerpt.default"> <div class="elementor-widget-container"> Black Friday and Cyber Monday are almost here. If everything goes right, the traffic to your WooCommerce store will surge simply because more... </div> </div> <div class="elementor-element elementor-element-d355311 elementor-widget elementor-widget-post-info" data-id="d355311" data-element_type="widget" data-widget_type="post-info.default"> <div class="elementor-widget-container"> <ul class="elementor-inline-items elementor-icon-list-items elementor-post-info"> <li class="elementor-icon-list-item elementor-repeater-item-6239d4b elementor-inline-item" itemprop="author"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-author"> Ziv Geurts </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-604839e elementor-inline-item" itemprop="datePublished"> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-date"> <span class="elementor-post-info__item-prefix">Created: </span> <time>Oct 14, 2024</time> </span> </li> <li class="elementor-icon-list-item elementor-repeater-item-8e234fd elementor-inline-item"> <span class="elementor-icon-list-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.34704 1.56056C9.27796 1.55896 10.1965 1.77351 11.0304 2.18731C11.8646 2.60125 12.5913 3.20327 13.1532 3.94592C13.7151 4.68858 14.0968 5.55158 14.2683 6.46691C14.4398 7.38224 14.3964 8.3249 14.1414 9.22059C13.8865 10.1163 13.4271 10.9405 12.7993 11.6284C12.1715 12.3162 11.3926 12.8489 10.5238 13.1844C9.65511 13.5199 8.72033 13.649 7.79318 13.5617C6.97713 13.4848 6.18662 13.242 5.46968 12.8495L3.43585 13.8184C2.58567 14.2234 1.69807 13.336 2.10291 12.4857L3.07148 10.4515C2.6118 9.6121 2.35857 8.67344 2.33509 7.7135C2.30888 6.64194 2.56991 5.5829 3.09109 4.64626C3.61228 3.70963 4.37462 2.92954 5.29901 2.38694C6.22312 1.84451 7.27551 1.55919 8.34704 1.56056ZM10.497 3.26224C9.8293 2.9309 9.09373 2.75916 8.3483 2.76056H8.34631C7.48859 2.75932 6.64617 2.98764 5.90647 3.42183C5.16677 3.85602 4.55674 4.48025 4.13969 5.22975C3.72263 5.97924 3.51376 6.82669 3.53473 7.68415C3.5557 8.54161 3.80576 9.37784 4.25896 10.106C4.36701 10.2797 4.37919 10.4964 4.29128 10.681L3.42871 12.4926L5.23992 11.6298C5.42453 11.5419 5.64121 11.554 5.81485 11.662C6.44783 12.0557 7.1636 12.297 7.90575 12.367C8.6479 12.4369 9.39615 12.3335 10.0915 12.065C10.7869 11.7964 11.4104 11.37 11.9129 10.8194C12.4154 10.2688 12.7832 9.60906 12.9873 8.8921C13.1913 8.17514 13.2261 7.42058 13.0888 6.68789C12.9515 5.95521 12.646 5.26441 12.1962 4.66994C11.7465 4.07548 11.1648 3.59359 10.497 3.26224Z" fill="black"></path></svg> </span> <span class="elementor-icon-list-text elementor-post-info__item elementor-post-info__item--type-custom"> <hyvor-talk-comment-count instance="https://talk.hyvor.com" website-id="10503" page-id="119348" ></hyvor-talk-comment-count> </span> </li> </ul> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </aside> <aside class="elementor-section elementor-top-section elementor-element elementor-element-615ff2a elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="615ff2a" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2454b1d" data-id="2454b1d" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-0cbabc9 elementor-widget elementor-widget-heading" data-id="0cbabc9" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h5 class="elementor-heading-title elementor-size-default">Comments</h5> </div> </div> <div class="elementor-element elementor-element-6623e69 elementor-widget elementor-widget-shortcode" data-id="6623e69" data-element_type="widget" data-widget_type="shortcode.default"> <div class="elementor-widget-container"> <div class="elementor-shortcode"> <script async src="https://talk.hyvor.com/embed/embed.js" type="module"></script> <div class="comments-area"> <hyvor-talk-comments instance="https://talk.hyvor.com" website-id="10503" loading="default" page-id="67261" page-title="How a Leading Design Agency Revamped Their Website With Elementor" page-url="https://elementor.com/blog/osm-and-elementor/" data-unique-id="67339b85b990c" ></hyvor-talk-comments> </div> </div> </div> </div> </div> </div> </div> </aside> <section class="elementor-section elementor-top-section elementor-element elementor-element-240a80c0 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="240a80c0" data-element_type="section"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c97f72b" data-id="c97f72b" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-281f9378 elementor-widget elementor-widget-template" data-id="281f9378" data-element_type="widget" data-widget_type="template.default"> <div class="elementor-widget-container"> <div class="elementor-template"> <div data-elementor-type="section" data-elementor-id="78971" class="elementor elementor-78971 elementor-location-single" data-elementor-post-type="elementor_library"> <section class="elementor-section elementor-top-section elementor-element elementor-element-69ec14a9 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="69ec14a9" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-22b2168" data-id="22b2168" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-7e35c2b2 elementor-widget elementor-widget-html" data-id="7e35c2b2" data-element_type="widget" data-widget_type="html.default"> <div class="elementor-widget-container"> <script> jQuery(document).ready(function($){ $(window).on('scroll', function(){ if($(window).scrollTop() >= $('.sticky-area').offset().top){ $('.dialog-lightbox-widget').addClass('sticky-banner'); } else { $('.dialog-lightbox-widget').removeClass('sticky-banner'); } if($(window).scrollTop() >= $('.stop-banner').offset().top - 400){ $('.dialog-lightbox-widget').removeClass('sticky-banner'); } }); }); </script> </div> </div> </div> </div> </div> </section> </div> </div> </div> </div> </div> </div> </div> </section> <aside class="elementor-section elementor-top-section elementor-element elementor-element-1804c6a1 elementor-section-full_width elementor-section-height-min-height elementor-hidden-desktop elementor-hidden-tablet mobile-banner elementor-section-height-default elementor-section-items-middle" data-id="1804c6a1" data-element_type="section" data-settings="{"background_background":"classic","sticky":"bottom","sticky_on":["mobile"],"sticky_offset":0,"sticky_effects_offset":0}"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-60194704" data-id="60194704" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-71b87d74 elementor-widget__width-initial elementor-widget-mobile__width-initial elementor-widget elementor-widget-heading" data-id="71b87d74" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Start a New Website</h2> </div> </div> <div class="elementor-element elementor-element-703b8dc3 elementor-mobile-align-justify elementor-widget__width-initial elementor-widget-mobile__width-initial elementor-widget elementor-widget-button" data-id="703b8dc3" data-element_type="widget" data-gal="sticky bottom mobile section" data-gtm-element-location="sticky bottom mobile section" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://elementor.com/pricing/" aria-label="Get started with Elementor Hosting"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.79998 8.05688C1.79998 7.72551 2.06861 7.45688 2.39998 7.45688L12.2652 7.45689L8.56251 3.75423C8.32819 3.51992 8.32819 3.14002 8.56251 2.9057C8.79682 2.67139 9.17672 2.67139 9.41103 2.9057L14.138 7.63262C14.3723 7.86694 14.3723 8.24683 14.138 8.48115L9.41103 13.2081C9.17672 13.4424 8.79682 13.4424 8.56251 13.2081C8.32819 12.9738 8.32819 12.5939 8.56251 12.3595L12.2652 8.65688L2.39998 8.65688C2.06861 8.65688 1.79998 8.38826 1.79998 8.05688Z" fill="white"></path></svg> </span> <span class="elementor-button-text">Get Started</span> </span> </a> </div> </div> </div> </div> </div> </div> </aside> </div> <div data-elementor-type="footer" data-elementor-id="18066" class="elementor elementor-18066 elementor-location-footer" data-elementor-post-type="elementor_library"> <footer class="elementor-element elementor-element-6607fb1 main-footer e-grid e-con-boxed e-con e-parent" data-id="6607fb1" data-element_type="container" data-settings="{"background_background":"classic"}" data-gtm-element-location="footer"> <div class="e-con-inner"> <div class="elementor-element elementor-element-2cccf79 footerAccord e-con-full e-flex e-con e-child" data-id="2cccf79" data-element_type="container"> <div class="elementor-element elementor-element-88b2658 elementor-view-default elementor-widget elementor-widget-icon" data-id="88b2658" data-element_type="widget" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <div class="elementor-icon"> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="elementor-logo" width="163" height="27" viewBox="0 0 163 27" fill="none"><title id="catTitle">Elementor Logo</title><path d="M102.054 12.939C102.054 12.939 100.65 13.2733 99.465 13.5566L97.6605 13.9676C97.6546 13.9676 97.6467 13.9676 97.6447 13.9676C97.6447 13.4818 97.6801 12.9685 97.7961 12.4965C97.9455 11.8907 98.2738 11.1827 98.8419 10.8719C99.4611 10.5336 100.216 10.4943 100.872 10.7559C101.551 11.0253 101.861 11.6803 101.995 12.3588C102.032 12.5476 102.058 12.7384 102.075 12.9311L102.054 12.939ZM106.756 13.9656C106.756 9.25916 103.792 7.23535 100.006 7.23535C95.7242 7.23535 93.043 10.2012 93.043 13.9892C93.043 18.1077 95.3252 20.7903 100.241 20.7903C102.899 20.7903 104.405 20.3203 106.192 19.4254L105.51 16.3415C104.145 16.9532 102.876 17.3288 101.181 17.3288C99.3235 17.3288 98.2639 16.6227 97.8649 15.305H106.638C106.709 14.953 106.756 14.5537 106.756 13.9656Z" fill="currentColor"></path><path d="M62.9249 12.939C62.9249 12.939 61.5214 13.2733 60.3361 13.5566L58.5316 13.9676C58.5257 13.9676 58.5178 13.9676 58.5158 13.9676C58.5158 13.4818 58.5512 12.9685 58.6672 12.4965C58.8166 11.8907 59.1449 11.1827 59.7129 10.8719C60.3322 10.5336 61.087 10.4943 61.7435 10.7559C62.4217 11.0253 62.7323 11.6803 62.866 12.3588C62.9033 12.5476 62.9289 12.7384 62.9466 12.9311L62.9249 12.939ZM67.627 13.9656C67.627 9.25916 64.6626 7.23535 60.8767 7.23535C56.5953 7.23535 53.9141 10.2012 53.9141 13.9892C53.9141 18.1077 56.1963 20.7903 61.1125 20.7903C63.7702 20.7903 65.2759 20.3203 67.0628 19.4254L66.3807 16.3415C65.0165 16.9532 63.7466 17.3288 62.0522 17.3288C60.1946 17.3288 59.135 16.6227 58.736 15.305H67.509C67.5798 14.953 67.627 14.5537 67.627 13.9656Z" fill="currentColor"></path><path d="M52.311 3.77588H47.9668V20.3204H52.311V3.77588Z" fill="currentColor"></path><path d="M107.674 7.65838H112.238L113.198 10.583C113.799 9.13936 115.151 7.28076 117.55 7.28076C120.842 7.28076 122.631 8.95055 122.631 13.2578V20.3185H118.069C118.069 18.8474 118.071 17.3762 118.072 15.9051C118.072 15.2305 118.061 14.5559 118.071 13.8813C118.078 13.2578 118.122 12.6147 117.791 12.0561C117.567 11.6785 117.2 11.4012 116.803 11.2123C115.997 10.8269 115.124 10.8387 114.334 11.2497C114.139 11.35 113.199 11.8594 113.199 12.0954V20.3185H108.637V11.0747L107.674 7.65838Z" fill="currentColor"></path><path d="M126.324 10.9755H124.23V7.65759H126.324V5.58265L130.886 4.50879V7.65759H135.472V10.9755H130.886V14.6947C130.886 16.1541 131.592 16.8365 132.65 16.8365C133.731 16.8365 134.344 16.6949 135.26 16.3901L135.801 19.826C134.554 20.3669 133.002 20.6265 131.425 20.6265C128.109 20.6265 126.32 19.0491 126.32 15.9908V10.9755H126.324Z" fill="currentColor"></path><path d="M144.252 17.026C145.921 17.026 146.91 15.8262 146.91 13.8949C146.91 11.9635 145.968 10.8582 144.323 10.8582C142.652 10.8582 141.689 11.9635 141.689 13.9657C141.689 15.8479 142.631 17.026 144.252 17.026ZM144.299 7.16455C148.581 7.16455 151.708 9.84723 151.708 14.0129C151.708 18.2021 148.581 20.7196 144.252 20.7196C139.947 20.7196 136.889 18.1313 136.889 14.0129C136.891 9.84723 139.926 7.16455 144.299 7.16455Z" fill="currentColor"></path><path d="M88.9542 7.61891C88.1463 7.28652 87.2322 7.16262 86.3614 7.28849C85.9172 7.35339 85.4827 7.48123 85.0798 7.67988C83.975 8.22664 83.1121 9.47161 82.6482 10.5828C82.3454 9.30443 81.4589 8.1519 80.1655 7.61891C79.3575 7.28652 78.4435 7.16262 77.5727 7.28849C77.1284 7.35339 76.694 7.48123 76.291 7.67988C75.1882 8.22467 74.3272 9.46571 73.8633 10.573V10.4924L72.9335 7.65824H68.3711L69.3323 11.0745V20.3203H73.8653V12.0599C73.881 11.9989 74.0835 11.8848 74.1189 11.8573C74.6496 11.4797 75.2747 11.0903 75.9391 11.0411C76.6173 10.99 77.2857 11.3361 77.6906 11.875C77.7339 11.934 77.7751 11.993 77.8125 12.0559C78.1447 12.6145 78.0995 13.2576 78.0916 13.8811C78.0837 14.5557 78.0955 15.2303 78.0936 15.9049C78.0916 17.3761 78.0896 18.8472 78.0896 20.3184H82.6541V13.2576C82.6541 13.2222 82.6541 13.1868 82.6541 13.1514V12.0618C82.6639 12.0028 82.8723 11.8829 82.9096 11.8573C83.4404 11.4797 84.0655 11.0903 84.7299 11.0411C85.408 10.99 86.0764 11.3361 86.4813 11.875C86.5246 11.934 86.5659 11.993 86.6032 12.0559C86.9354 12.6145 86.8902 13.2576 86.8843 13.8811C86.8764 14.5557 86.8882 15.2303 86.8863 15.9049C86.8843 17.3761 86.8823 18.8472 86.8823 20.3184H91.4448V13.2576C91.4428 11.1886 91.146 8.52166 88.9542 7.61891Z" fill="currentColor"></path><path d="M162.503 7.28271C160.105 7.28271 158.752 9.14131 158.151 10.5849L157.189 7.66033H152.625L153.586 11.0766V20.3224H158.151V11.7788C158.801 11.6647 162.33 12.3137 163 12.5596V7.29845C162.837 7.28861 162.672 7.28271 162.503 7.28271Z" fill="currentColor"></path><path d="M41.6632 12.5161C41.6632 12.5161 40.2597 12.8505 39.0744 13.1337L37.2698 13.5448C37.2639 13.5448 37.2561 13.5448 37.2541 13.5448C37.2541 13.059 37.2895 12.5456 37.4055 12.0736C37.5548 11.4679 37.8831 10.7598 38.4512 10.4491C39.0704 10.1108 39.8253 10.0714 40.4818 10.333C41.16 10.6025 41.4706 11.2574 41.6042 11.9359C41.6416 12.1248 41.6671 12.3155 41.6848 12.5083L41.6632 12.5161ZM46.3672 13.5428C46.3672 8.83631 43.4029 6.8125 39.6169 6.8125C35.3355 6.8125 32.6543 9.77839 32.6543 13.5664C32.6543 17.6848 34.9365 20.3675 39.8528 20.3675C42.5104 20.3675 44.0162 19.8974 45.803 19.0026L45.1209 15.9187C43.7567 16.5303 42.4868 16.906 40.7924 16.906C38.9348 16.906 37.8753 16.1999 37.4762 14.8822H46.2492C46.32 14.5321 46.3672 14.1309 46.3672 13.5428Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.2084C0 20.4107 5.83624 26.2501 13.0347 26.2501C20.2332 26.2501 26.0695 20.4107 26.0695 13.2084C26.0695 6.00609 20.2332 0.166748 13.0347 0.166748C5.83624 0.166748 0 6.00609 0 13.2084ZM9.77554 7.77424H7.60342V18.6426H9.77554V7.77424ZM11.9477 7.77424H18.4641V9.94753H11.9477V7.77424ZM18.4641 12.1208H11.9477V14.2941H18.4641V12.1208ZM11.9477 16.4693H18.4641V18.6426H11.9477V16.4693Z" fill="currentColor"></path></svg> </div> </div> </div> </div> <div class="elementor-element elementor-element-f1d75a1 e-grid-align-left elementor-grid-mobile-5 e-grid-align-mobile-left elementor-shape-rounded elementor-grid-0 elementor-widget elementor-widget-social-icons" data-id="f1d75a1" data-element_type="widget" data-widget_type="social-icons.default"> <div class="elementor-widget-container"> <div class="elementor-social-icons-wrapper elementor-grid"> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-cf6fe02" href="https://wordpress.org/plugins/elementor/" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="wordpress-logo" data-prefix="fab" data-icon="wordpress" viewBox="0 0 512 512"><title>Wordpress logo</title><path d="M61.7 169.4l101.5 278C92.2 413 43.3 340.2 43.3 256c0-30.9 6.6-60.1 18.4-86.6zm337.9 75.9c0-26.3-9.4-44.5-17.5-58.7-10.8-17.5-20.9-32.4-20.9-49.9 0-19.6 14.8-37.8 35.7-37.8.9 0 1.8.1 2.8.2-37.9-34.7-88.3-55.9-143.7-55.9-74.3 0-139.7 38.1-177.8 95.9 5 .2 9.7.3 13.7.3 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l77.5 230.4L249.8 247l-33.1-90.8c-11.5-.7-22.3-2-22.3-2-11.5-.7-10.1-18.2 1.3-17.5 0 0 35.1 2.7 56 2.7 22.2 0 56.7-2.7 56.7-2.7 11.5-.7 12.8 16.2 1.4 17.5 0 0-11.5 1.3-24.3 2l76.9 228.7 21.2-70.9c9-29.4 16-50.5 16-68.7zm-139.9 29.3l-63.8 185.5c19.1 5.6 39.2 8.7 60.1 8.7 24.8 0 48.5-4.3 70.6-12.1-.6-.9-1.1-1.9-1.5-2.9l-65.4-179.2zm183-120.7c.9 6.8 1.4 14 1.4 21.9 0 21.6-4 45.8-16.2 76.2l-65 187.9C426.2 403 468.7 334.5 468.7 256c0-37-9.4-71.8-26-102.1zM504 256c0 136.8-111.3 248-248 248C119.2 504 8 392.7 8 256 8 119.2 119.2 8 256 8c136.7 0 248 111.2 248 248zm-11.4 0c0-130.5-106.2-236.6-236.6-236.6C125.5 19.4 19.4 125.5 19.4 256S125.6 492.6 256 492.6c130.5 0 236.6-106.1 236.6-236.6z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-86492a0" href="https://github.com/elementor/elementor" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="github-logo" data-prefix="fab" data-icon="github" viewBox="0 0 496 512"><title>Github logo</title><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-81e64c6" href="https://www.producthunt.com/products/elementor" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="producthunt-logo" data-prefix="fab" data-icon="product-hunt" class="svg-inline--fa fa-product-hunt fa-w-16" viewBox="0 0 512 512"><title id="catTitle">ProductHunt Logo</title><path d="M326.3 218.8c0 20.5-16.7 37.2-37.2 37.2h-70.3v-74.4h70.3c20.5 0 37.2 16.7 37.2 37.2zM504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-128.1-37.2c0-47.9-38.9-86.8-86.8-86.8H169.2v248h49.6v-74.4h70.3c47.9 0 86.8-38.9 86.8-86.8z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-580c20d" href="https://www.instagram.com/elementor/" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="instagram-logo" data-prefix="fab" data-icon="instagram" class="svg-inline--fa fa-instagram fa-w-14" viewBox="0 0 448 512"><title id="catTitle">Instagram Logo</title><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-0cd3763" href="https://www.facebook.com/elemntor/" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="facebook-logo" data-prefix="fab" data-icon="facebook-f" class="svg-inline--fa fa-facebook-f fa-w-10" viewBox="0 0 320 512"><title id="catTitle">Facebook Logo</title><path d="M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-dad8830" href="https://x.com/elemntor" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"></path></svg> </a> </span> <span class="elementor-grid-item"> <a class="elementor-icon elementor-social-icon elementor-social-icon- elementor-repeater-item-cc4e560" href="https://www.youtube.com/channel/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1" target="_blank" rel="noopener noreferrer"> <span class="elementor-screen-only"></span> <svg xmlns="http://www.w3.org/2000/svg" aria-labelledby="youtube-logo" data-prefix="fab" data-icon="youtube" class="svg-inline--fa fa-youtube fa-w-18" viewBox="0 0 576 512"><title id="catTitle">Youtube Logo</title><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path></svg> </a> </span> </div> </div> </div> <div class="elementor-element elementor-element-9c510cb elementor-widget elementor-widget-text-editor" data-id="9c510cb" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Elementor is the leading website builder platform for professionals on WordPress. Elementor serves web professionals, including developers, designers and marketers, and boasts a new website created every 10 seconds on its platform.</p> </div> </div> <div class="elementor-element elementor-element-7e607b5 elementor-widget elementor-widget-heading" data-id="7e607b5" data-element_type="widget" tabindex="-1" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Subscribe to our newsletter</div> </div> </div> <div class="elementor-element elementor-element-3e41e7b elementor-widget__width-initial elementor-widget-mobile__width-initial newsletter-signup-form elementor-button-align-end elementor-widget elementor-widget-form" data-id="3e41e7b" data-element_type="widget" data-settings="{"step_next_label":"Next","step_previous_label":"Previous","additional_attributes":[{"_id":"d23a634","attr_key":"newsletter_subscriber","attr_value":"true"}],"button_width":"40","button_width_mobile":"30","step_type":"number_text","step_icon_shape":"circle"}" data-widget_type="form.default"> <div class="elementor-widget-container"> <form class="elementor-form" method="post" action="https://form.strattic.com/forms/68ea1133-823f-45d4-800f-2233a42081a0" id="elementor_newsletter_subscribe_newsletter" name="Newsletter roll"> <input type="hidden" name="post_id" value="18066"/> <input type="hidden" name="form_id" value="3e41e7b"/> <input type="hidden" name="referer_title" value="How A Leading Design Agency Revamped Their Website With Elementor | Elementor" /> <input type="hidden" name="queried_id" value="67261"/> <div class="elementor-form-fields-wrapper elementor-labels-"> <div class="elementor-field-type-email elementor-field-group elementor-column elementor-field-group-email_newsletter elementor-col-60 elementor-sm-70 elementor-field-required"> <label for="form-field-email_newsletter" class="elementor-field-label elementor-screen-only"> Email </label> <input size="1" type="email" name="form_fields[email_newsletter]" id="form-field-email_newsletter" class="elementor-field elementor-size-sm elementor-field-textual" placeholder="Whats your email" required="required" aria-required="true"> </div> <div class="elementor-field-type-hidden elementor-field-group elementor-column elementor-field-group-newsletter_subscribe elementor-col-100"> <input size="1" type="hidden" name="form_fields[newsletter_subscribe]" id="form-field-newsletter_subscribe" class="elementor-field elementor-size-sm elementor-field-textual" value="elementor_newsletter_subscribe"> </div> <div class="elementor-field-group elementor-column elementor-field-type-submit elementor-col-40 e-form__buttons elementor-sm-30"> <button class="elementor-button elementor-size-sm" type="submit"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none"><path fill="currentColor" fill-rule="evenodd" d="m8.595 13.561-.36-.37-.362.37c.2.204.523.204.722 0Zm-.36-1.11-2.363-2.42a.502.502 0 0 0-.722 0c-.2.205-.2.536 0 .74l2.723 2.79.361-.37.361.37 5.255-5.382c.2-.205.2-.536 0-.74a.502.502 0 0 0-.722 0L8.234 12.45Z" clip-rule="evenodd"></path><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width=".2" d="m8.234 13.191.361.37m-.36-.37-.362.37m.361-.37.361.37m0 0a.502.502 0 0 1-.722 0m.722 0 5.255-5.382c.2-.205.2-.536 0-.74a.502.502 0 0 0-.722 0L8.234 12.45l-2.362-2.42a.502.502 0 0 0-.722 0c-.2.205-.2.536 0 .74l2.723 2.79"></path></svg> </span> <span class="elementor-button-text">Subscribe</span> </span> </button> </div> </div> </form> </div> </div> <div class="elementor-element elementor-element-8fa65d9 elementor-widget elementor-widget-text-editor" data-id="8fa65d9" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>By entering your email, you agree to our<br /><strong><a href="https://elementor.com/terms/" target="_blank" rel="noopener">Terms & Conditions </a></strong>and <strong><a href="https://elementor.com/about/privacy/" target="_blank" rel="noopener">Privacy Policy</a></strong>.</p> </div> </div> <div class="elementor-element elementor-element-f3e4148 footerContent elementor-widget elementor-widget-text-editor" data-id="f3e4148" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>© Elementor. All rights reserved</p> </div> </div> </div> <div class="elementor-element elementor-element-e030633 e-con-full e-flex e-con e-child" data-id="e030633" data-element_type="container"> <div class="elementor-element elementor-element-ebc0cbf e-con-full menu-column e-flex e-con e-child" data-id="ebc0cbf" data-element_type="container"> <div class="elementor-element elementor-element-acd2d74 menu-column_heading elementor-widget elementor-widget-heading" data-id="acd2d74" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Web Creation</div> </div> </div> <div class="elementor-element elementor-element-d86aed3 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="d86aed3" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/wordpress-hosting/"> <span class="elementor-icon-list-text">WordPress Hosting</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/ecommerce-hosting/"> <span class="elementor-icon-list-text">eCommerce Hosting</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/page-builder-plugin/"> <span class="elementor-icon-list-text">Page Builder Plugin</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/hello-theme/"> <span class="elementor-icon-list-text">Hello Theme</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/dynamic-content/"> <span class="elementor-icon-list-text">Dynamic Content</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/ecommerce/"> <span class="elementor-icon-list-text">eCommerce</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/theme-builder/"> <span class="elementor-icon-list-text">Theme Builder</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/landing-page-builder/"> <span class="elementor-icon-list-text">Landing Page Builder</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/popup-builder/"> <span class="elementor-icon-list-text">Popup Builder</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/form-builder/"> <span class="elementor-icon-list-text">Form Builder</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/contact-button/"> <span class="elementor-icon-list-text">Contact Buttons</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/workflow/"> <span class="elementor-icon-list-text">Workflow Optimization</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/ai/"> <span class="elementor-icon-list-text">Elementor AI</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/image-optimizer/"> <span class="elementor-icon-list-text">Image Optimizer</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/products/site-mailer/"> <span class="elementor-icon-list-text">Site Mailer</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/woocommerce-builder/"> <span class="elementor-icon-list-text">WooCommerce Builder</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/link-in-bio/"> <span class="elementor-icon-list-text">Link in Bio</span> </a> </li> </ul> </div> </div> </div> <div class="elementor-element elementor-element-ccb0337 e-con-full menu-column e-flex e-con e-child" data-id="ccb0337" data-element_type="container"> <div class="elementor-element elementor-element-9b74b71 menu-column_heading elementor-widget elementor-widget-heading" data-id="9b74b71" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Elementor For</div> </div> </div> <div class="elementor-element elementor-element-b9bb03d elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="b9bb03d" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/for/designer/"> <span class="elementor-icon-list-text">Web Designers</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/for/developer/"> <span class="elementor-icon-list-text">Developers</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/for/marketer/"> <span class="elementor-icon-list-text">Marketers</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/for/agency/"> <span class="elementor-icon-list-text">Agencies</span> </a> </li> </ul> </div> </div> </div> </div> <div class="elementor-element elementor-element-259de80 e-con-full menu-column e-flex e-con e-child" data-id="259de80" data-element_type="container"> <div class="elementor-element elementor-element-0cf14b2 menu-column_heading elementor-widget elementor-widget-heading" data-id="0cf14b2" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Resources</div> </div> </div> <div class="elementor-element elementor-element-ad665b0 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="ad665b0" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/help/"> <span class="elementor-icon-list-text">Help Center</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/academy/"> <span class="elementor-icon-list-text">Academy</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/"> <span class="elementor-icon-list-text">Blog</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/addons/"> <span class="elementor-icon-list-text">Add-Ons</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/roadmap/"> <span class="elementor-icon-list-text">Roadmap</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://developers.elementor.com/"> <span class="elementor-icon-list-text">Developers Website</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/support/"> <span class="elementor-icon-list-text">Support</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/resources/glossary/"> <span class="elementor-icon-list-text">Web Creators Glossary</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/features/integrations/"> <span class="elementor-icon-list-text">Integrations</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/web-creators/"> <span class="elementor-icon-list-text">Web Creator Stories</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/community/meetups/"> <span class="elementor-icon-list-text">Meetups</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://prompts.elementor.com/"> <span class="elementor-icon-list-text">AI Prompt Library</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/wordpress/"> <span class="elementor-icon-list-text">WordPress Download</span> </a> </li> </ul> </div> </div> </div> <div class="elementor-element elementor-element-60157b8 e-con-full menu-column e-flex e-con e-child" data-id="60157b8" data-element_type="container"> <div class="elementor-element elementor-element-dafb342 menu-column_heading elementor-widget elementor-widget-heading" data-id="dafb342" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Company</div> </div> </div> <div class="elementor-element elementor-element-9d5bc64 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="9d5bc64" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/about/"> <span class="elementor-icon-list-text">About Us</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/contact/"> <span class="elementor-icon-list-text">Contact Us</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.careers/explore/"> <span class="elementor-icon-list-text">Careers</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/faq/"> <span class="elementor-icon-list-text">FAQs</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/affiliates/"> <span class="elementor-icon-list-text">Affiliate Program</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/trust/"> <span class="elementor-icon-list-text">Trust Center</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/logos/"> <span class="elementor-icon-list-text">Media</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/terms/trademark-guidelines/"> <span class="elementor-icon-list-text">Trademark</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/terms/"> <span class="elementor-icon-list-text">Terms & Conditions</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/terms/elementor-ai-terms-and-conditions/"> <span class="elementor-icon-list-text">AI Terms & Conditions</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/about/privacy/"> <span class="elementor-icon-list-text">Privacy Policy</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/terms/cookie-policy/"> <span class="elementor-icon-list-text">Cookie Policy</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/terms/accessibility/"> <span class="elementor-icon-list-text">Website Accessibility Statement</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/open-source-software-components/"> <span class="elementor-icon-list-text">Open-Source Software Components</span> </a> </li> </ul> </div> </div> </div> <div class="elementor-element elementor-element-53edea2 e-con-full menu-column e-flex e-con e-child" data-id="53edea2" data-element_type="container"> <div class="elementor-element elementor-element-f50ae85 menu-column_heading elementor-widget elementor-widget-heading" data-id="f50ae85" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Pricing</div> </div> </div> <div class="elementor-element elementor-element-c0e74f4 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="c0e74f4" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/pricing/"> <span class="elementor-icon-list-text">WordPress Hosting</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/pricing-ecommerce-hosting/"> <span class="elementor-icon-list-text">eCommerce Hosting</span> </a> </li> <li class="elementor-icon-list-item"> <a href="https://elementor.com/pricing-plugin/"> <span class="elementor-icon-list-text">Page Builder Plugin</span> </a> </li> </ul> </div> </div> <div class="elementor-element elementor-element-ce1f263 e-con-full menu-column related-content e-flex e-con e-child" data-id="ce1f263" data-element_type="container"> <div class="elementor-element elementor-element-afec5d8 menu-column_heading elementor-widget elementor-widget-heading" data-id="afec5d8" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <div class="elementor-heading-title elementor-size-default">Related Content</div> </div> </div> <div class="elementor-element elementor-element-7d264ae elementor-grid-1 elementor-grid-mobile-2 elementor-grid-tablet-2 elementor-widget elementor-widget-loop-grid" data-id="7d264ae" data-element_type="widget" data-settings="{"template_id":108460,"columns":1,"columns_mobile":2,"row_gap":{"unit":"px","size":16,"sizes":[]},"_skin":"post","columns_tablet":"2","edit_handle_selector":"[data-elementor-type=\"loop-item\"]","row_gap_tablet":{"unit":"px","size":"","sizes":[]},"row_gap_mobile":{"unit":"px","size":"","sizes":[]}}" data-widget_type="loop-grid.post"> <div class="elementor-widget-container"> <div class="elementor-loop-container elementor-grid"> <style id="loop-108460">.elementor-108460 .elementor-element.elementor-element-26d606f2{--display:flex;--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-bottom:calc(16px/2);}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-top:calc(16px/2);}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-right:calc(16px/2);margin-left:calc(16px/2);}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items.elementor-inline-items{margin-right:calc(-16px/2);margin-left:calc(-16px/2);}body.rtl .elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{left:calc(-16px/2);}body:not(.rtl) .elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{right:calc(-16px/2);}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-108460 .elementor-element.elementor-element-4218576f{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-item > a{font-family:"DM Sans", Sans-serif;font-size:14px;font-weight:400;font-style:normal;line-height:1.5em;letter-spacing:-0.02em;}.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-text{color:#FFFFFF;transition:color 0.3s;}@media(max-width:767px){.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-item > a{font-size:14px;}}/* Start custom CSS for icon-list, class: .elementor-element-4218576f */.elementor-108460 .elementor-element.elementor-element-4218576f .elementor-icon-list-text { display: inline-block; width: calc(100% - 20px); white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis; }/* End custom CSS */</style> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-80881 post-80881 post type-post status-publish format-standard has-post-thumbnail hentry category-new-features category-elementor tag-pro tag-video" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/announcing-scroll-snap-and-progress-tracker/"> <span class="elementor-icon-list-text">More of Elementor Pro 3.5: Improve User Experience With Scroll Snap and Progress Tracker</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-80800 post-80800 post type-post status-publish format-standard has-post-thumbnail hentry category-template-kit category-elementor category-marketing tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/christmas-kit/"> <span class="elementor-icon-list-text">Maximize Your Holiday Sales With Our Christmas Seasonal Kit</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-80568 post-80568 post type-post status-publish format-standard has-post-thumbnail hentry category-elementor tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/black-friday-2021-addons-discounts/"> <span class="elementor-icon-list-text">Elementor’s Roundup of Black Friday Discounts and Deals</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-78741 post-78741 post type-post status-publish format-standard has-post-thumbnail hentry category-marketing tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/how-to-improve-your-landing-page-conversion-rate/"> <span class="elementor-icon-list-text">Improving Your Landing Page Conversion Rate: A Step-by-Step Guide</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-33053 post-33053 post type-post status-publish format-standard has-post-thumbnail hentry category-marketing tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/black-friday-marketing/"> <span class="elementor-icon-list-text">Unlock Black Friday Sales With These 8 Marketing Strategies</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-78316 post-78316 post type-post status-publish format-standard has-post-thumbnail hentry category-blog tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/happy-addons-thought-leadership-interview/"> <span class="elementor-icon-list-text">HappyAddons Thought Leadership Interview</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-78046 post-78046 post type-post status-publish format-standard has-post-thumbnail hentry category-design category-elementor category-new-features category-template-kit tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/new-landing-page-templates/"> <span class="elementor-icon-list-text">15 Brand-New Elementor Landing Page Templates</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-77872 post-77872 post type-post status-publish format-standard has-post-thumbnail hentry category-elementor category-community tag-pro tag-video" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/ask-me-anything-session-with-elementors-vp-product/"> <span class="elementor-icon-list-text">Ask-Me-Anything Session with Elementor’s VP Product — The Takeaways</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-77126 post-77126 post type-post status-publish format-standard has-post-thumbnail hentry category-marketing category-tips-tricks tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/landing-page-optimization/"> <span class="elementor-icon-list-text">Why You Need to Optimize Your Landing Page Now</span> </a> </li> </ul> </div> </div> </div> </div> <div data-elementor-type="loop-item" data-elementor-id="108460" class="elementor elementor-108460 e-loop-item e-loop-item-74515 post-74515 post type-post status-publish format-standard has-post-thumbnail hentry category-elementor category-inspiration tag-pro" data-elementor-post-type="elementor_library" data-custom-edit-handle="1"> <div class="elementor-element elementor-element-26d606f2 e-con-full e-flex e-con e-parent" data-id="26d606f2" data-element_type="container"> <div class="elementor-element elementor-element-4218576f elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list" data-id="4218576f" data-element_type="widget" data-widget_type="icon-list.default"> <div class="elementor-widget-container"> <ul class="elementor-icon-list-items"> <li class="elementor-icon-list-item"> <a href="https://elementor.com/blog/import-export-benefits/"> <span class="elementor-icon-list-text">9 Ways Elementor’s Import/Export Helps Web Creators Complete Projects Faster</span> </a> </li> </ul> </div> </div> </div> </div> </div> </div> </div> <div class="elementor-element elementor-element-e033755 elementor-grid-1 elementor-grid-mobile-2 elementor-grid-tablet-2 elementor-widget elementor-widget-loop-grid" data-id="e033755" data-element_type="widget" data-settings="{"template_id":108460,"columns":1,"columns_mobile":2,"_skin":"post","columns_tablet":"2","edit_handle_selector":"[data-elementor-type=\"loop-item\"]","row_gap":{"unit":"px","size":"","sizes":[]},"row_gap_tablet":{"unit":"px","size":"","sizes":[]},"row_gap_mobile":{"unit":"px","size":"","sizes":[]}}" data-widget_type="loop-grid.post"> <div class="elementor-widget-container"> <div class="e-loop-nothing-found-message"> </div> </div> </div> <div class="elementor-element elementor-element-ac5915d elementor-widget elementor-widget-shortcode" data-id="ac5915d" data-element_type="widget" data-widget_type="shortcode.default"> <div class="elementor-widget-container"> <div class="elementor-shortcode"><ul class="elementor-icon-list-items"></ul></div> </div> </div> </div> </div> </div> </footer> </div> <script src="https://talk.hyvor.com/embed/comment-counts.js" type="module" onload="loadHyvorTalkCommentCounts()"></script> <script> function loadHyvorTalkCommentCounts() { hyvorTalkCommentCounts.load({ "instance": "https://talk.hyvor.com", "website-id": "10503", }) } </script>  <noscript> <iframe src="https://gtm.elementor.com/ns.html?id=GTM-NJK8HW" height="0" width="0" style="display:none;visibility:hidden"></iframe> </noscript>  <div data-elementor-type="popup" data-elementor-id="95567" class="elementor elementor-95567 elementor-location-popup" data-elementor-settings="{"a11y_navigation":"yes","triggers":{"exit_intent":"yes"},"timing":{"times_times":1,"times_period":"session","times_count":"close","times":"yes"}}" data-elementor-post-type="elementor_library"> <div class="elementor-element elementor-element-8d1050f e-flex e-con-boxed e-con e-parent" data-id="8d1050f" data-element_type="container" id="form" data-settings="{"background_background":"classic"}"> <div class="e-con-inner"> <div class="elementor-element elementor-element-11db728 e-grid form-wrap e-con-boxed e-con e-child" data-id="11db728" data-element_type="container"> <div class="e-con-inner"> <div class="elementor-element elementor-element-d67ae50 elementor-widget elementor-widget-image" data-id="d67ae50" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <img loading="lazy" width="343" height="358" src="https://elementor.com/blog/wp-content/uploads/2024/06/Group-10882003.svg" class="attachment-large size-large wp-image-95569" alt="" /> </div> </div> <div class="elementor-element elementor-element-f1cdc19 elementor-absolute elementor-view-default elementor-widget elementor-widget-icon" data-id="f1cdc19" data-element_type="widget" data-settings="{"_position":"absolute"}" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <a class="elementor-icon" href="#elementor-action%3Aaction%3Dpopup%3Aclose%26settings%3DeyJkb19ub3Rfc2hvd19hZ2FpbiI6IiJ9" data-gtm-event_name="element_click" data-gtm-type="cta" data-gtm-section="popup" data-gtm-element_name="close button in newsletter popup" data-gtm-outcome="closing the popup" data-gtm-internal_campaign="default behaviour"> <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 33 33" width="33" height="33"><path fill-rule="evenodd" clip-rule="evenodd" d="m16.859 18.484-7.787 7.33-2.143-2.278 7.649-7.199-7.65-7.199 2.144-2.277 7.787 7.33 7.787-7.33 2.143 2.277-7.65 7.2 7.65 7.198-2.143 2.277-7.787-7.329Z" fill="currentColor"></path></svg> </a> </div> </div> </div> <div class="elementor-element elementor-element-6563ce2 e-con-full e-flex e-con e-child" data-id="6563ce2" data-element_type="container"> <div class="elementor-element elementor-element-f69a2f0 e-con-full e-flex e-con e-child" data-id="f69a2f0" data-element_type="container"> <div class="elementor-element elementor-element-9dba1da elementor-widget elementor-widget-heading" data-id="9dba1da" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Don't Miss Out!</h2> </div> </div> <div class="elementor-element elementor-element-cce89fb elementor-widget elementor-widget-text-editor" data-id="cce89fb" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Subscribe to get exclusive<br />deals & news before anyone else!</p> </div> </div> <div class="elementor-element elementor-element-e010b87 elementor-button-align-start elementor-widget elementor-widget-form" data-id="e010b87" data-element_type="widget" data-settings="{"step_next_label":"Next","step_previous_label":"Previous","additional_attributes":[],"button_width":"100","step_type":"number_text","step_icon_shape":"circle"}" data-widget_type="form.default"> <div class="elementor-widget-container"> <form class="elementor-form" method="post" action="https://form.strattic.com/forms/d131e5d5-14c4-4a2c-8c20-8f989dec78b7" id="elementor_newsletter_subscribe_subsexit" name="blog_sub"> <input type="hidden" name="post_id" value="95567"/> <input type="hidden" name="form_id" value="e010b87"/> <input type="hidden" name="referer_title" value="How A Leading Design Agency Revamped Their Website With Elementor | Elementor" /> <input type="hidden" name="queried_id" value="67261"/> <div class="elementor-form-fields-wrapper elementor-labels-above"> <div class="elementor-field-type-email elementor-field-group elementor-column elementor-field-group-email_subsexit elementor-col-100 elementor-field-required elementor-mark-required"> <label for="form-field-email_subsexit" class="elementor-field-label"> Email Address </label> <input size="1" type="email" name="form_fields[email_subsexit]" id="form-field-email_subsexit" class="elementor-field elementor-size-sm elementor-field-textual" placeholder="Type in Your Email" required="required" aria-required="true"> </div> <div class="elementor-field-type-acceptance elementor-field-group elementor-column elementor-field-group-field_02eb15a elementor-col-100 elementor-field-required elementor-mark-required"> <div class="elementor-field-subgroup"> <span class="elementor-field-option"> <input type="checkbox" name="form_fields[field_02eb15a]" id="form-field-field_02eb15a" class="elementor-field elementor-size-sm elementor-acceptance-field" required="required" aria-required="true"> <label for="form-field-field_02eb15a">By signing up, you agree to receive Elementor emails, including marketing emails, and to our <a href="https://elementor.com/terms">Terms of Service & Privacy Policy</a>.</label> </span> </div> </div> <div class="elementor-field-type-hidden elementor-field-group elementor-column elementor-field-group-newsletter_subscribe elementor-col-100"> <input size="1" type="hidden" name="form_fields[newsletter_subscribe]" id="form-field-newsletter_subscribe" class="elementor-field elementor-size-sm elementor-field-textual" value="elementor_newsletter_subscribe"> </div> <div class="elementor-field-group elementor-column elementor-field-type-submit elementor-col-100 e-form__buttons"> <button class="elementor-button elementor-size-sm" type="submit"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.24999 10.071C2.24999 9.65683 2.58578 9.32104 2.99999 9.32104L15.3315 9.32105L10.7031 4.69273C10.4103 4.39983 10.4103 3.92496 10.7031 3.63207C10.996 3.33917 11.4709 3.33917 11.7638 3.63207L17.6725 9.54071C17.9653 9.83361 17.9653 10.3085 17.6725 10.6014L11.7638 16.51C11.4709 16.8029 10.996 16.8029 10.7031 16.51C10.4103 16.2171 10.4103 15.7423 10.7031 15.4494L15.3315 10.821L2.99999 10.821C2.58578 10.821 2.24999 10.4853 2.24999 10.071Z" fill="currentColor"></path></svg> </span> <span class="elementor-button-text">Let’s Go </span> </span> </button> </div> </div> </form> </div> </div> </div> </div> </div> </div> <div class="elementor-element elementor-element-a893b7a e-con-full thank-you e-flex e-con e-child" data-id="a893b7a" data-element_type="container" data-settings="{"background_background":"classic"}"> <div class="elementor-element elementor-element-e9c08e8 elementor-widget elementor-widget-heading" data-id="e9c08e8" data-element_type="widget" data-widget_type="heading.default"> <div class="elementor-widget-container"> <h2 class="elementor-heading-title elementor-size-default">Thank You!<br> You’re In!</h2> </div> </div> <div class="elementor-element elementor-element-ade724d elementor-widget elementor-widget-text-editor" data-id="ade724d" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Don’t just sit back—dive right into<br />our current plans now!</p> </div> </div> <div class="elementor-element elementor-element-c954fc0 elementor-widget elementor-widget-button" data-id="c954fc0" data-element_type="widget" data-widget_type="button.default"> <div class="elementor-widget-container"> <div class="elementor-button-wrapper"> <a class="elementor-button elementor-button-link elementor-size-sm" href="https://elementor.com/pricing/"> <span class="elementor-button-content-wrapper"> <span class="elementor-button-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.24999 10.071C2.24999 9.65683 2.58578 9.32104 2.99999 9.32104L15.3315 9.32105L10.7031 4.69273C10.4103 4.39983 10.4103 3.92496 10.7031 3.63207C10.996 3.33917 11.4709 3.33917 11.7638 3.63207L17.6725 9.54071C17.9653 9.83361 17.9653 10.3085 17.6725 10.6014L11.7638 16.51C11.4709 16.8029 10.996 16.8029 10.7031 16.51C10.4103 16.2171 10.4103 15.7423 10.7031 15.4494L15.3315 10.821L2.99999 10.821C2.58578 10.821 2.24999 10.4853 2.24999 10.071Z" fill="currentColor"></path></svg> </span> <span class="elementor-button-text">Explore Plans</span> </span> </a> </div> </div> </div> <div class="elementor-element elementor-element-2b9b7bb elementor-widget elementor-widget-html" data-id="2b9b7bb" data-element_type="widget" data-widget_type="html.default"> <div class="elementor-widget-container"> <script> document.addEventListener('strattic-form-success', function() { var formElement = document.querySelector('#form'); formElement.classList.add('form-thanks'); }); </script> <script> jQuery(document).ready(function($) { jQuery( document ).on( 'submit_success', 'form#elementor_newsletter_subscribe_subsexit', function( event, response ){ dataLayer.push({ 'event' : 'fireEvent', 'event_name': 'form_submit', 'type': 'newsletter form single post', 'section': 'popup', 'outcome': 'completing a form', 'level_1': 'popup blog' }); }); }); </script> <script> if ('complete' === document.readyState) { dataLayer.push( { 'data-gtm-event_name': 'element_impression', 'data-gtm-type': 'view', 'data-gtm-section': 'popup', 'data-gtm-element_name': 'newsletter subscription', 'data-gtm-outcome': 'viewing the popup', 'data-gtm-internal_campaign': 'default behaviour' } ); } </script> </div> </div> </div> </div> </div> </div> <div data-elementor-type="popup" data-elementor-id="84405" class="elementor elementor-84405 elementor-location-popup" data-elementor-settings="{"entrance_animation":"fadeIn","prevent_close_on_background_click":"yes","prevent_close_on_esc_key":"yes","classes":"sticky-banner banner-popup","entrance_animation_duration":{"unit":"px","size":1.2,"sizes":[]},"a11y_navigation":"yes","triggers":{"scrolling_to_selector":"#share-btn","scrolling_to":"yes"},"timing":{"devices_devices":["desktop"],"devices":"yes"}}" data-elementor-post-type="elementor_library"> <section class="elementor-section elementor-top-section elementor-element elementor-element-3eb75e6d elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="3eb75e6d" data-element_type="section"> <div class="elementor-container elementor-column-gap-no"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1964e519" data-id="1964e519" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-6b593af elementor-cta--valign-top banner-general-cloud elementor-widget__width-auto elementor-absolute elementor-cta--skin-cover elementor-widget elementor-widget-call-to-action" data-id="6b593af" data-element_type="widget" data-settings="{"_position":"absolute"}" data-gal="inner banner" data-gtm-element-location="inner banner" data-widget_type="call-to-action.default"> <div class="elementor-widget-container"> <a class="elementor-cta" href="https://elementor.com/pricing/" aria-label="Explore Plans" data-gtm-event_name="element_click" data-gtm-type="cta" data-gtm-section="sidebar" data-gtm-element_name="blog banner" data-gtm-outcome="clicking on blog banner" data-gtm-additional_description="hosting banner"> <div class="elementor-cta__bg-wrapper"> <div class="elementor-cta__bg elementor-bg" style="background-image: url(https://elementor.com/blog/wp-content/uploads/2022/07/Hosting_banner_blog_216_366_b.png);" role="img" aria-label=""></div> <div class="elementor-cta__bg-overlay"></div> </div> <div class="elementor-cta__content"> <div class="elementor-cta__title elementor-cta__content-item elementor-content-item"> <b>Host & Build</b> Your Website with Elementor Hosting </div> <div class="elementor-cta__button-wrapper elementor-cta__content-item elementor-content-item "> <span class="elementor-cta__button elementor-button elementor-size-"> Explore Plans </span> </div> </div> </a> </div> </div> <div class="elementor-element elementor-element-5eb9829 elementor-widget elementor-widget-html" data-id="5eb9829" data-element_type="widget" data-widget_type="html.default"> <div class="elementor-widget-container"> <script> function fireOnce() { dataLayer.push({ 'event': 'fireEvent', 'event_name': 'element_impression', 'type': 'view', 'section': 'sidebar', 'element_name': 'blog banner', 'outcome': 'viewing blog banner', 'additional_description': 'hosting banner' }); // Remove the listener after execution to ensure it fires only once window.removeEventListener('stickyBannerAdded', fireOnce); } window.addEventListener('stickyBannerAdded', fireOnce); </script> </div> </div> </div> </div> </div> </section> </div> <script> addEventListener( 'onSiteCreationStart', function () { if ( ! window.braze || ! braze.logCustomEvent ) { return; } braze.logCustomEvent( 'site_creation_start_event' ); } ); </script> <script type='text/javascript'> const lazyloadRunObserver = () => { const lazyloadBackgrounds = document.querySelectorAll( `.e-con.e-parent:not(.e-lazyloaded)` ); const lazyloadBackgroundObserver = new IntersectionObserver( ( entries ) => { entries.forEach( ( entry ) => { if ( entry.isIntersecting ) { let lazyloadBackground = entry.target; if( lazyloadBackground ) { lazyloadBackground.classList.add( 'e-lazyloaded' ); } lazyloadBackgroundObserver.unobserve( entry.target ); } }); }, { rootMargin: '200px 0px 200px 0px' } ); lazyloadBackgrounds.forEach( ( lazyloadBackground ) => { lazyloadBackgroundObserver.observe( lazyloadBackground ); } ); }; const events = [ 'DOMContentLoaded', 'elementor/lazyload/observe', ]; events.forEach( ( event ) => { document.addEventListener( event, lazyloadRunObserver ); } ); </script> <link rel='stylesheet' id='elementor-font-awesome-solid-css' href='https://elementor.com/blog/wp-content/plugins/elementor/assets/lib/font-awesome/css/solid.css?ver=3.24.6' media='all' /> <link rel='stylesheet' id='elementor-post-78971-css' href='https://elementor.com/blog/wp-content/uploads/elementor/css/post-78971.css?ver=1730815475' media='all' /> <script src="https://elementor.com/blog/wp-content/plugins/elementor-network/assets/js/geo-loader.js?ver=1.4.34" id="elementor-network-geo-loader-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/lib/smartmenus/jquery.smartmenus.min.js?ver=1.2.1" id="smartmenus-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/lib/sticky/jquery.sticky.min.js?ver=3.24.4" id="e-sticky-js"></script> <script src="https://elementor.com/blog/wp-includes/js/imagesloaded.min.js?ver=5.0.0" id="imagesloaded-js"></script> <script src="https://elementor.com/blog/strattic_assets/js/forms/elementor-forms-widget.js?ver=e036e2dc5182ffbf2204af4d37e73f66081b1ab4" id="strattic-compatibility-elementor-pro-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor/assets/js/webpack.runtime.min.js?ver=3.24.6" id="elementor-webpack-runtime-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor/assets/js/frontend-modules.min.js?ver=3.24.6" id="elementor-frontend-modules-js"></script> <script src="https://elementor.com/blog/wp-includes/js/jquery/ui/core.min.js?ver=1.13.3" id="jquery-ui-core-js"></script> <script id="elementor-frontend-js-before"> var elementorFrontendConfig = {"environmentMode":{"edit":false,"wpPreview":false,"isScriptDebug":false},"i18n":{"shareOnFacebook":"Share on Facebook","shareOnTwitter":"Share on Twitter","pinIt":"Pin it","download":"Download","downloadImage":"Download image","fullscreen":"Fullscreen","zoom":"Zoom","share":"Share","playVideo":"Play Video","previous":"Previous","next":"Next","close":"Close","a11yCarouselWrapperAriaLabel":"Carousel | Horizontal scrolling: Arrow Left & Right","a11yCarouselPrevSlideMessage":"Previous slide","a11yCarouselNextSlideMessage":"Next slide","a11yCarouselFirstSlideMessage":"This is the first slide","a11yCarouselLastSlideMessage":"This is the last slide","a11yCarouselPaginationBulletMessage":"Go to slide"},"is_rtl":false,"breakpoints":{"xs":0,"sm":480,"md":768,"lg":1025,"xl":1440,"xxl":1600},"responsive":{"breakpoints":{"mobile":{"label":"Mobile Portrait","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Landscape","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet Portrait","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Landscape","value":1200,"default_value":1200,"direction":"max","is_enabled":false},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}},"hasCustomBreakpoints":false},"version":"3.24.6","is_static":false,"experimentalFeatures":{"e_font_icon_svg":true,"additional_custom_breakpoints":true,"container":true,"container_grid":true,"e_swiper_latest":true,"e_nested_atomic_repeaters":true,"e_onboarding":true,"home_screen":true,"nested-elements":true,"editor_v2":true,"link-in-bio":true,"floating-buttons":true,"display-conditions":true,"form-submissions":true,"mega-menu":true},"urls":{"assets":"https:\/\/elementor.com\/blog\/wp-content\/plugins\/elementor\/assets\/","ajaxurl":"https:\/\/elementor.com\/blog\/wp-admin\/admin-ajax.php","uploadUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads"},"nonces":{"floatingButtonsClickTracking":"dc456f7588"},"swiperClass":"swiper","settings":{"page":[],"editorPreferences":[]},"kit":{"stretched_section_container":"#primary","active_breakpoints":["viewport_mobile","viewport_tablet"],"global_image_lightbox":"yes","lightbox_enable_counter":"yes","lightbox_enable_fullscreen":"yes","lightbox_enable_zoom":"yes","lightbox_enable_share":"yes","lightbox_title_src":"title","lightbox_description_src":"description"},"post":{"id":67261,"title":"How%20A%20Leading%20Design%20Agency%20Revamped%20Their%20Website%20With%20Elementor%20%7C%20Elementor","excerpt":"For the large Belgrade-based agency OSM, the timing of the Elementor 3.2 release couldn't be better \u2014 it was time for a makeover. Learn how their designer used the new Text Path, Mask, Sticky Column, and Gradient Buttons to give their website a fresh and stylish look.\n\n\n","featuredImage":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2021\/10\/2022_3_blog_How-a-Leading-Design-Agency-Revamped-Their-Website-With-Elementor.jpg"}}; </script> <script src="https://elementor.com/blog/wp-content/plugins/elementor/assets/js/frontend.min.js?ver=3.24.6" id="elementor-frontend-js"></script> <script id="elementor-network-newsletter-enrollment-js-extra"> var newsletterEnrollmentData = {"cfWorkerUrl":"https:\/\/elementor.com\/api\/v1\/newsletter"}; </script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-network/assets/js/newsletter-enrollment.min.js?ver=1.4.34" id="elementor-network-newsletter-enrollment-js"></script> <script src="https://elementor.com/blog/wp-includes/js/underscore.min.js?ver=1.13.4" id="underscore-js"></script> <script id="wp-util-js-extra"> var _wpUtilSettings = {"ajax":{"url":"\/wp-admin\/admin-ajax.php"}}; </script> <script src="https://elementor.com/blog/wp-includes/js/wp-util.min.js?ver=6.6.2" id="wp-util-js"></script> <script id="strattic-forms-elementor-forms-js-extra"> var stratticForms = {"forms":{"elementor_newsletter_subscribe":{"messages":{"success_message":"Thanks for signing up to Elementor! <style>.elementor-form-fields-wrapper{display: none;}.newsletter-signup-form .elementor-widget-container{padding-left: 1rem;}<\/style>","error_message":"An error occurred.","required_field_message":null,"invalid_message":"There's something wrong. The form is invalid."},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]}},"integration":["elementorforms"],"elementorforms":{"messageClass":"elementor-message-success","errorClass":"elementor-message-danger","meta_locale":"","meta_date":"F j, Y","meta_time":{"format":"g:i A","timezone":"Asia\/Jerusalem"}},"globalWidgetMap":[],"base_url":["https:\/\/form.strattic.com"]}; var stratticForms = {"forms":{"elementor_newsletter_subscribe":{"messages":{"success_message":"Thanks for signing up to Elementor! <style>.elementor-form-fields-wrapper{display: none;}.newsletter-signup-form .elementor-widget-container{padding-left: 1rem;}<\/style>","error_message":"An error occurred.","required_field_message":null,"invalid_message":"There's something wrong. The form is invalid."},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]},"elementor_newsletter_subscribe_newsletter":{"messages":{"success_message":"Thanks for signing up to Elementor!","error_message":"An error occurred.","required_field_message":null,"invalid_message":"There's something wrong. The form is invalid."},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]}},"integration":["elementorforms"],"elementorforms":{"messageClass":"elementor-message-success","errorClass":"elementor-message-danger","meta_locale":"","meta_date":"F j, Y","meta_time":{"format":"g:i A","timezone":"Asia\/Jerusalem"}},"globalWidgetMap":[],"base_url":["https:\/\/form.strattic.com"]}; var stratticForms = {"forms":{"elementor_newsletter_subscribe":{"messages":{"success_message":"Thanks for signing up to Elementor! <style>.elementor-form-fields-wrapper{display: none;}.newsletter-signup-form .elementor-widget-container{padding-left: 1rem;}<\/style>","error_message":"An error occurred.","required_field_message":null,"invalid_message":"There's something wrong. The form is invalid."},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]},"elementor_newsletter_subscribe_newsletter":{"messages":{"success_message":"Thanks for signing up to Elementor!","error_message":"An error occurred.","required_field_message":null,"invalid_message":"There's something wrong. The form is invalid."},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]},"elementor_newsletter_subscribe_subsexit":{"messages":{"success_message":null,"error_message":null,"required_field_message":null,"invalid_message":null},"form_id_prefix":"elementorforms-","form_meta":{"form_metadata":null,"form_metadata_2":null},"spinnerIds":["ajax-loader"],"params_map":[]}},"integration":["elementorforms"],"elementorforms":{"messageClass":"elementor-message-success","errorClass":"elementor-message-danger","meta_locale":"","meta_date":"F j, Y","meta_time":{"format":"g:i A","timezone":"Asia\/Jerusalem"}},"globalWidgetMap":[],"base_url":["https:\/\/form.strattic.com"]}; </script> <script defer src="https://elementor.com/blog/strattic_assets/js/forms/elementor-forms.js?ver=e036e2dc5182ffbf2204af4d37e73f66081b1ab4" id="strattic-forms-elementor-forms-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/js/webpack-pro.runtime.min.js?ver=3.24.4" id="elementor-pro-webpack-runtime-js"></script> <script src="https://elementor.com/blog/wp-includes/js/dist/hooks.min.js?ver=2810c76e705dd1a53b18" id="wp-hooks-js"></script> <script src="https://elementor.com/blog/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script> <script id="wp-i18n-js-after"> wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); </script> <script id="elementor-pro-frontend-js-before"> var ElementorProFrontendConfig = {"ajaxurl":"https:\/\/elementor.com\/blog\/wp-admin\/admin-ajax.php","nonce":"5b2b87f2e8","urls":{"assets":"https:\/\/elementor.com\/blog\/wp-content\/plugins\/elementor-pro\/assets\/","rest":"https:\/\/elementor.com\/blog\/wp-json\/"},"settings":{"lazy_load_background_images":true},"shareButtonsNetworks":{"facebook":{"title":"Facebook","has_counter":true},"twitter":{"title":"Twitter"},"linkedin":{"title":"LinkedIn","has_counter":true},"pinterest":{"title":"Pinterest","has_counter":true},"reddit":{"title":"Reddit","has_counter":true},"vk":{"title":"VK","has_counter":true},"odnoklassniki":{"title":"OK","has_counter":true},"tumblr":{"title":"Tumblr"},"digg":{"title":"Digg"},"skype":{"title":"Skype"},"stumbleupon":{"title":"StumbleUpon","has_counter":true},"mix":{"title":"Mix"},"telegram":{"title":"Telegram"},"pocket":{"title":"Pocket","has_counter":true},"xing":{"title":"XING","has_counter":true},"whatsapp":{"title":"WhatsApp"},"email":{"title":"Email"},"print":{"title":"Print"},"x-twitter":{"title":"X"},"threads":{"title":"Threads"}},"facebook_sdk":{"lang":"en_US","app_id":""},"lottie":{"defaultAnimationUrl":"https:\/\/elementor.com\/blog\/wp-content\/plugins\/elementor-pro\/modules\/lottie\/assets\/animations\/default.json"}}; </script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/js/frontend.min.js?ver=3.24.4" id="elementor-pro-frontend-js"></script> <script src="https://elementor.com/blog/wp-content/plugins/elementor-pro/assets/js/elements-handlers.min.js?ver=3.24.4" id="pro-elements-handlers-js"></script> <script> jQuery(document).ready(function($) { document.querySelectorAll(".elementor-post-info__item--type-comments").forEach(ele => { ele.textContent.includes('No Comments') && ele.parentNode.remove(); }); }); </script> <script> jQuery(document).ready(function($) { $(".elementor-post").each (function () { var postName = $(this).find(".elementor-post__title").text().trim(); $(this).find("a").attr("aria-label", function () { return "Read more: " + postName }); }); }); </script> <style> @media (min-width: 768px) { .sc-hero .elementor-widget-theme-post-title { width: 1140px !important; max-width: 1140px !important; } } </style> <script> jQuery(document).ready(function($) { jQuery( document ).on( 'submit_success', 'form#elementor_newsletter_subscribe', function( event, response ){ event.preventDefault(); var $thisForm = $( this ); let isNewsletter = $thisForm.find('input[name="form_fields[newsletter_subscribe]"]').val(); if ( 'elementor_newsletter_subscribe' === isNewsletter ) { if ( window.dataLayer && dataLayer.push ) { dataLayer.push( { 'event': 'GAEvent', 'eventCategory': 'form engagement', 'eventAction': 'form submit success', 'eventLabel': 'newsletter', 'customMetricKey': '31', 'customMetricValue': 1 } ); } } if ( 'undefined' !== typeof response.link && '' !== response.link ) { setTimeout( function() { location.href = response.link; }, 500 ); } return false; }); }); </script> <script> jQuery(document).ready(function($) { var clonedElement = $('.cta-banner-middle').clone(); // Find the third <h2> element within .post-content // Note: index is zero-based, so we use 1 to select the second element var targetH2 = $('.post-content h2').eq(1); // Insert the cloned element above the third <h2> targetH2.before(clonedElement); }) </script> <script> jQuery(document).ready(function($) { setTimeout(function() { var bodyClass = document.body.className.split(' ').find(function(cls) { return cls.startsWith('category-'); }); if (bodyClass) { var bannerName = bodyClass.replace('category-', '').replace('-', ' '); var ctaBanner = document.querySelector('.post-content .cta-banner-middle'); if (ctaBanner) { var observer = new IntersectionObserver(function(entries) { if (entries[0].isIntersecting) { window.dataLayer = window.dataLayer || []; window.dataLayer.push({ 'event': 'fireEvent', 'event_name': 'element_impression', 'type': 'view', 'section': 'in blog', 'element_name': 'blog banner', 'outcome': 'viewing blog banner', 'additional_description': bannerName }); observer.disconnect(); } }, { threshold: 0.1 }); observer.observe(ctaBanner); } } }, 100); }); </script> <script> jQuery(document).ready(function($) { var hasFired = false; // Flag to track if the event has been fired $(window).on('scroll', function() { var $dialogLightboxWidget = $('.dialog-lightbox-widget'); var scrollTop = $(window).scrollTop(); var stickyAreaTop = $('.sticky-area').offset().top; var stopBannerTop = $('.stop-banner').offset().top - 400; if (scrollTop >= stickyAreaTop && !hasFired) { $dialogLightboxWidget.addClass('sticky-banner'); // Dispatch a custom event when the class is added var event = new Event('stickyBannerAdded'); window.dispatchEvent(event); hasFired = true; // Set the flag to true after firing the event } else if (scrollTop < stickyAreaTop || scrollTop >= stopBannerTop) { $dialogLightboxWidget.removeClass('sticky-banner'); // Optionally reset the flag if you want to fire the event again in the future // hasFired = false; } }); }); </script> <script> jQuery(document).ready(function($) { $('.main-nav').find('a').each(function() { var secondLevelNameLower = $(this).text().trim().toLowerCase(); $(this).attr({ 'data-gtm-event_name': 'element_click', 'data-gtm-type': 'navigation', 'data-gtm-section': 'menu', 'data-gtm-outcome': 'navigating using the main menu', 'data-gtm-english_text': secondLevelNameLower, 'data-gtm-level_1': secondLevelNameLower, 'data-gtm-additional_description': 'main menu blog' }); }); }) </script> <script> jQuery(document).ready(function($) { $('.toggle').click(function() { $('.dropdown-wrapper').toggleClass('show'); $('.toggle').toggleClass('active'); }); }); </script> </body> </html>