{"id":7362,"date":"2022-01-30T08:36:29","date_gmt":"2022-01-30T08:36:29","guid":{"rendered":"https:\/\/elementor.com\/academy\/?p=7362"},"modified":"2023-02-21T09:42:34","modified_gmt":"2023-02-21T09:42:34","slug":"create-a-neumorphic-style-website","status":"publish","type":"post","link":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/","title":{"rendered":"Create a Neumorphic Style Website"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"7362\" class=\"elementor elementor-7362\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-2ad4faff thesinglevideo elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"2ad4faff\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-29aaeff3\" data-id=\"29aaeff3\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-54f82041 elementor-widget elementor-widget-video\" data-id=\"54f82041\" data-element_type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/Pp2Z-Hwaro0&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-30fb945d thesinglevideoOver elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"30fb945d\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-140a576a\" data-id=\"140a576a\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2f5e3179 elementor-tabs-view-horizontal elementor-widget elementor-widget-tabs\" data-id=\"2f5e3179\" data-element_type=\"widget\" data-widget_type=\"tabs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-tabs\">\n\t\t\t<div class=\"elementor-tabs-wrapper\" role=\"tablist\" >\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-7941\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-7941\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-7942\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-7942\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<div class=\"elementor-tabs-content-wrapper\" role=\"tablist\" aria-orientation=\"vertical\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-7941\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-7941\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-7941\" tabindex=\"0\" hidden=\"false\"><p>In this tutorial, we\u2019ll learn how to add neumorphic style effects to enhance our website designs in Elementor. As a bonus, we\u2019ll also use CSS code to really add that wow factor.<\/p><p>Neumorphism, or soft UI, is a design style that combines highlights and shadows, to make elements look as if they\u2019re emerging from the page.<\/p><p>The tutorial will cover:<br \/>\u2714\ufe0e Styling buttons for a soft UI effect<br \/>\u2714\ufe0e Using pre-styled images to complement layouts<br \/>\u2714\ufe0e Using image boxes to style layouts<br \/>\u2714\ufe0e Reusing styles for a more efficient workflow<br \/>\u2714\ufe0e Adding CSS to enhance<br \/>\u2714\ufe0e And much more!<\/p><p>CSS Code Snippet:<br \/>selector {<br \/>box-shadow: 3px 3px 7px rgba(174, 174, 192, 0.25), -3px -3px 7px rgba(255, 255, 255, 0.7), inset 3px 3px 3px rgba(255, 255, 255, 0.7), inset -3px -3px 3px rgba(174, 174, 192, 0.25);<br \/>border-radius: 30px;<br \/>}<\/p><p>See Also:<br \/><a href=\"https:\/\/youtu.be\/CjdFxKPPikU\" target=\"_blank\" rel=\"noopener\">Global Styles<\/a><br \/><a href=\"https:\/\/elementor.com\/academy\/margin-and-padding-basics-in-elementor\/\" target=\"_blank\" rel=\"noopener\">Margin and Padding<\/a><br \/><a href=\"https:\/\/elementor.com\/academy\/how-to-add-custom-css\/\" target=\"_blank\" rel=\"noopener\">Custom CSS<\/a><\/p><\/div>\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-7942\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-7942\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-7942\" tabindex=\"0\" hidden=\"hidden\"><p>Hey everyone! Shiri here, from Elementor.<br \/>In today\u2019s video, we\u2019ll see how to build a neumorphic style website in Elementor.<\/p><p>Neumorphism, also known as soft UI, is a design style that combines highlights and shadows, to make elements look as if they\u2019re emerging from the page.<\/p><p>We\u2019ll cover three ways to add Neumorphic style to our website: First, we\u2019ll create and style a button with a soft UI, and add decorative elements around it. Next, we\u2019ll build off that to add and style these image boxes, and last, we\u2019ll kick it up a notch, and add a bit of custom CSS code to these images, for an extra sleek look.<\/p><p>Feel free to use the timestamps if you wish to skip ahead, at any time.<br \/>Let\u2019s begin with this button in the hero section. As you can see, it uses two opposing shadows, to create a neumorphic effect. You\u2019ll notice that we\u2019re using a light grey background to make sure the white highlight stays visible. Let\u2019s see how we can create this effect using only Elementor.<\/p><p>First, I\u2019ll delete the button, so we can start from scratch. Now let\u2019s drag in a new button. We\u2019ll change the text and head over to Style. Since our default typography and color already look great, let\u2019s move on to the border radius.<\/p><p>We\u2019ll round it by changing it to 100 pixels, and set the padding.<br \/>Looking better already!<\/p><p>Now it\u2019s time to create that neumorphic look! We\u2019ll start by adding a white box-shadow first. Open the box shadow settings and choose a light color. Then define the properties for your shadows. I\u2019m using minus ten (-10) both for horizontal and vertical axis, as well as a 15 pixels blur effect.<\/p><p>Great!<\/p><p>To add the second shadow on the opposite sides of the button, we\u2019ll go to the Advanced tab and under Border, add a new box shadow using a darker color. For the horizontal and vertical settings, we\u2019ll use the opposite values, and reuse the same value for the blur setting.<\/p><p>Notice that the second box shadow is seen here?<\/p><p>That\u2019s because each box shadow applies to a different part of the widget. The first box shadow we added was applied only to the button itself, but this shadow is applied to the entire widget\u2019s frame. In order for the second shadow to apply only to our button, we\u2019ll need to tweak the widget\u2019s shape and size.<\/p><p>First, add a border radius to match the button\u2019s rounded corners.<br \/>Then, under Positioning, set the widget\u2019s width to Inline..<\/p><p>Now that we have our desired effect, let&#8217;s center the button, by clicking on the column and setting the horizontal align to center.<\/p><p>We can make this button more engaging by adding a hover effect.<br \/>Click the button, go to style options and set our desired effect.<\/p><p>Perfect!<\/p><p>To add more complex elements with a similar style, we can use images. I&#8217;ve already created this one in photoshop.<\/p><p>We\u2019ll drag in an image widget, select an image, and set its size to Full. Then in Style, set the width to 100 VW, or viewport width. Now we\u2019ll just duplicate it, and drag it above to create this decoration around our content, and\u2026 this section is done!<\/p><p>We\u2019ve created and styled a striking button and added images to our design. This website is already starting to look more polished, but we can add even more to it!<\/p><p>For our second example, we\u2019ll recreate this layout. We could drag in separate image, heading, and text widgets, and style them one by one. But to save time, we\u2019ll drag in this single image box widget, which contains all the elements we need, and helps keep our layout optimized.<\/p><p>We\u2019ll choose an image to fit our design, and update the title and description. And let\u2019s not forget to set the Image position!<\/p><p>Next, we\u2019ll go to the style tab, and make a few tweaks to set the spacing and width of the widget. We&#8217;ll also use global styles to get the result we need for our design.<\/p><p>Vertically align the text to the middle, and\u2026Another component, done!<\/p><p>Below, we need another similar element. We\u2019ll right click, duplicate and update any needed settings.<br \/>We saved the best part for last!<\/p><p>Using style options and images is pretty cool, but we can take this effect to the next level, by using a few lines of CSS code. Don\u2019t worry, we\u2019ll keep it simple, and provide you with the code in the description.<\/p><p>We have this section with 4 columns. We\u2019ll combine the neumorphic style button and apply something new, to achieve this look.<\/p><p>We\u2019ll delete this section and start from scratch, but before we do, let\u2019s go over it and see what we need to do to recreate it.<\/p><p>First, we have this image with the neumophic style. Then we have a heading, text and a button.<\/p><p>Okay, we\u2019re good to go. Let\u2019s delete this section and add a new section with 4 columns.<\/p><p>We\u2019ll start simple, with the heading and text. Instead of using a heading widget and a text editor widget, we\u2019ll add an Icon box.. and remove the icon.<br \/>Now we\u2019ll update the title and description. We can\u2019t see the title yet, because in this case its default color is the same as our background, but we\u2019ll be able to update that in the Style tab. So let\u2019s go to style, and while we\u2019re here, set all the style options we need. We just achieved the same layout &#8211; using fewer widgets! Amazing.<\/p><p>Next, we\u2019ll need to add a button here. Wait, don\u2019t drag in a new button. , All we have to do is duplicate the button we created before. It\u2019s a simple matter of copy.. And paste!<br \/>And now update the content.<\/p><p>Now for the main event &#8211; the image.<\/p><p>We\u2019ll add an image widget, and choose the image we need.<br \/>We need some space above and below the image,, so go to Advanced, and add padding to the top and the bottom of the widget.<\/p><p>Great!<\/p><p>Now at the bottom, we have this tab, where we can add custom CSS code!<\/p><p>Type in \u201cSelector\u201d, to target the widget we\u2019re working on. Then open a curly bracket and paste in this code, which as you\u2019ll recall, can be found in the video description<\/p><p>We\u2019ll hide the panel to preview our changes.<\/p><p>Next, we\u2019ll delete all the empty columns, and duplicate our finished one.<\/p><p>Wait\u2026 These columns are too close together. Don\u2019t worry, we don\u2019t need to start over from scratch. We can add some space to one of them, and then copy its style and paste it on the remaining columns. Cool, huh?<br \/>Now we only need to update the content and this layout is done.<\/p><p>The Final step is to add some space between these titles and the images by adding some margin to it.<\/p><p>And viola!<\/p><p>We now have a sleek neumorphic styled website, Made with Elementor! Well, and a few lines of code.<\/p><p>How will you use this style in your next project? Share your thoughts in the comments below.<\/p><p>Like this video? Give it a thumbs up, so we know what kind of content you\u2019d like to see more of.<\/p><p>Want to keep learning? We\u2019ve got you covered!<\/p><p>Check out these videos for more Elementor tutorials.<\/p><p>Until next time, keep creating!\u00a0<\/p><\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Overview Transcript Overview In this tutorial, we\u2019ll learn how to add neumorphic style effects to enhance our website designs in Elementor. As a bonus, we\u2019ll also use CSS code to really add that wow factor. Neumorphism, or soft UI, is a design style that combines highlights and shadows, to make elements look as if they\u2019re [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":7363,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[41,48],"class_list":["post-7362","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-layout","tag-guides-tutorials","tag-widgets"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Create a Neumorphic Style Website - Academy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Create a Neumorphic Style Website - Academy\" \/>\n<meta property=\"og:description\" content=\"Overview Transcript Overview In this tutorial, we\u2019ll learn how to add neumorphic style effects to enhance our website designs in Elementor. As a bonus, we\u2019ll also use CSS code to really add that wow factor. Neumorphism, or soft UI, is a design style that combines highlights and shadows, to make elements look as if they\u2019re [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/\" \/>\n<meta property=\"og:site_name\" content=\"Academy\" \/>\n<meta property=\"article:published_time\" content=\"2022-01-30T08:36:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-21T09:42:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Aviva Darab\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Aviva Darab\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Create a Neumorphic Style Website - Academy","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/","og_locale":"en_US","og_type":"article","og_title":"Create a Neumorphic Style Website - Academy","og_description":"Overview Transcript Overview In this tutorial, we\u2019ll learn how to add neumorphic style effects to enhance our website designs in Elementor. As a bonus, we\u2019ll also use CSS code to really add that wow factor. Neumorphism, or soft UI, is a design style that combines highlights and shadows, to make elements look as if they\u2019re [&hellip;]","og_url":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/","og_site_name":"Academy","article_published_time":"2022-01-30T08:36:29+00:00","article_modified_time":"2023-02-21T09:42:34+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg","type":"image\/jpeg"}],"author":"Aviva Darab","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Aviva Darab"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/"},"author":{"name":"Aviva Darab","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/6ce87fcf655168e5ac55e43148a99449"},"headline":"Create a Neumorphic Style Website","datePublished":"2022-01-30T08:36:29+00:00","dateModified":"2023-02-21T09:42:34+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/"},"wordCount":1435,"publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"image":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg","keywords":["Guides and Tutorials","Widgets"],"articleSection":["Design \/ Layout"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/","url":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/","name":"Create a Neumorphic Style Website - Academy","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg","datePublished":"2022-01-30T08:36:29+00:00","dateModified":"2023-02-21T09:42:34+00:00","breadcrumb":{"@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#primaryimage","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/01\/Neumorphic-button-Still001.jpg","width":1920,"height":1080,"caption":"Neumorphic Style Website"},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/academy\/create-a-neumorphic-style-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Elementor","item":"https:\/\/elementor.com\/"},{"@type":"ListItem","position":2,"name":"Academy","item":"https:\/\/elementor.com\/academy\/"},{"@type":"ListItem","position":3,"name":"Design \/ Layout","item":"https:\/\/elementor.com\/academy\/design-layout\/"},{"@type":"ListItem","position":4,"name":"Create a Neumorphic Style Website"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/academy\/#website","url":"https:\/\/elementor.com\/academy\/","name":"Elementor Academy","description":"Page Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/academy\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/academy\/#organization","name":"Elementor Academy","alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","url":"https:\/\/elementor.com\/academy\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","width":490,"height":85,"caption":"Elementor Academy"},"image":{"@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/6ce87fcf655168e5ac55e43148a99449","name":"Aviva Darab","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/5456d642d6417c9b72a48f8fbec624cc1336f934ce83732b6fa2358ab0c31bfe?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5456d642d6417c9b72a48f8fbec624cc1336f934ce83732b6fa2358ab0c31bfe?s=96&d=mm&r=g","caption":"Aviva Darab"},"description":"Aviva is a Designer and Educator at Elementor. She\u2019s experienced in web and graphic design and enjoys sharing her knowledge with others. She stays fueled with coffee, dark chocolate, and Pinterest.","url":"https:\/\/elementor.com\/academy\/author\/user-5e36e0380be94\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7362","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/comments?post=7362"}],"version-history":[{"count":2,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7362\/revisions"}],"predecessor-version":[{"id":9398,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/7362\/revisions\/9398"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media\/7363"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media?parent=7362"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/categories?post=7362"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/tags?post=7362"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}