{"id":157941,"date":"2016-08-12T14:00:54","date_gmt":"2016-08-12T14:00:54","guid":{"rendered":"https:\/\/premium.wpmudev.org\/blog\/?p=157941"},"modified":"2022-03-08T04:49:17","modified_gmt":"2022-03-08T04:49:17","slug":"wordpress-page-transitions","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/wordpress-page-transitions\/","title":{"rendered":"Creating Beautiful Page Transitions on Your WordPress Site"},"content":{"rendered":"<p>Okay, so you\u2019ve heard it before: humans have a shorter attention span <a href=\"http:\/\/blog.hubspot.com\/marketing\/human-attention-span-decreased#sm.00000jepgiyqhxec9r9hw9ydodgik\" rel=\"noopener\" target=\"_blank\">than goldfish<\/a>. If you think about it though, that\u2019s not really a fair comparison to make.<\/p>\n<p>Your pet goldfish probably only has a few interesting things to look at in your home. They might occasionally tune into whichever show or movie is playing on the TV, but otherwise, it\u2019s just a bunch of furniture they have to stare at. Not too many distractions there, right? But for humans, it\u2019s a different story.<\/p>\n<p>Whether it\u2019s in the world around us or in the digital space, there are distractions galore\u2014and they\u2019re all competing for our attention. Right now. That\u2019s why there is so much emphasis placed on designing websites effectively. Using colors and imagery to elicit the right emotions and reactions. <a href=\"https:\/\/wpmudev.com\/blog\/powerful-storytelling\/?utm_expid=3606929-74.aeX0WyvtRVa7qMe8Ph5smw.0&amp;utm_referrer=https%3A%2F%2Fwpmudev.com%2Fblog%2F\" target=\"_blank\" rel=\"noopener\">Guiding visitors through your story<\/a> with simple, easy-to-find navigation. Placing straightforward calls-to-action exactly where and when visitors are feeling motivated to do something.<\/p>\n<p>One of the points we try to drive home as much as possible is the <a href=\"https:\/\/wpmudev.com\/blog\/free-speed-testing-tools\/?utm_expid=3606929-74.aeX0WyvtRVa7qMe8Ph5smw.0&amp;utm_referrer=https%3A%2F%2Fwpmudev.com%2Fblog%2F\" target=\"_blank\" rel=\"noopener\">importance of your site\u2019s speed<\/a>. If you can\u2019t provide your visitors with that (near-)instant gratification of accessing your site and opening new pages within it, all of that other hard work was for naught.<\/p>\n<p>Back in 2000, you could\u2019ve gotten away with a website load time of maybe 12 seconds (the average human attention span at the time). But in 2016, you\u2019re dealing with a much shorter timeframe to hook your \u201cfish.\u201d Right now, we\u2019re looking at an average attention span of about 8 seconds. However, marketing studies would suggest that you really only have 3 seconds to gain someone\u2019s attention before they jump ship on your website.<\/p>\n<p>So what do you do?<\/p>\n<p>If you force visitors to sit and wait for a page to load, you\u2019re going to lose them\u2014them and the conversions you were hoping to make with your awesomely designed website. Don\u2019t give them a chance to get distracted. If you\u2019ve got a website that will unavoidably take some time to load or you just want to give the jump from page-to-page a little more pep, add some animation to your page transitions.<\/p>\n<p>Continue reading, or jump ahead using these links:<\/p>\n<ul>\n<li><a href=\"#faster-page-loading\">Smoother &amp; Faster Page Loading<\/a><\/li>\n<li><a href=\"#why-use-page-transitions\">Why Use Page Transitions?<\/a><\/li>\n<li><a href=\"#page-transition-animation\">Page Transition Animation<\/a><\/li>\n<li><a href=\"#basic-page-animation\">Basic Page Animation<\/a><\/li>\n<li><a href=\"#page-animation-tools\">Page Animation Tools<\/a><\/li>\n<\/ul>\n<h2 id=\"faster-page-loading\">Smoother &amp; Faster Page Loading<\/h2>\n<p>There are a number of ways to increase your website\u2019s speed. You could use a plugin (like <a href=\"https:\/\/wpmudev.com\/project\/wp-hummingbird\/?utm_expid=3606929-74.aeX0WyvtRVa7qMe8Ph5smw.0&amp;utm_referrer=https%3A%2F%2Fwpmudev.com%2Fprojects%2Fcategory%2Fplugins%2F\" target=\"_blank\" rel=\"noopener\">Hummingbird<\/a>) to minify and compress as much of your website\u2019s files as possible. That\u2019s always a great place to start. CDNs are also a must if you\u2019re hoping to decrease any lag time caused by visitors from around the globe trying to access your site\u2019s distant server files.<\/p>\n<p>Regardless of the tools you use to keep your site\u2019s speed in check, it\u2019s a good idea to consider giving your page transitions a bit more life.<\/p>\n<p>Let\u2019s say someone clicks on a link from your homepage and there is a sudden flash of white (no more than half a second) as the new page loads. That might take some people aback, leaving them to wonder why the page didn\u2019t load right away. Perhaps it\u2019s not even a matter of how quickly that next page loads. Let\u2019s say instead you have a single page website and your visitors are bored with the static banner strips littered through the page. Flat design is great in terms of keeping things simple, but it\u2019s not always great in keeping your visitors\u2019 attention.<\/p>\n<p>This is where animation in page transitions comes in.<\/p>\n<h2 id=\"why-use-page-transitions\">Why Use Page Transitions?<\/h2>\n<p>Animation, in general, is a great way to add more life to web design. However, it should be used strategically and should align well with the overall style of the website. This applies to basic elemental animation (like forcing an icon to spin when someone hovers over it) as well as in the transitioning from page-to-page.<\/p>\n<p>Here are some reasons why animation works especially well for page transitions:<\/p>\n<ul>\n<li><b>Movement<\/b>: The right type and right speed helps keep visitors engage in what\u2019s on the screen as your site loads in the background.<\/li>\n<li><b>Entertainment<\/b>: If your animation allows for some form of interactivity, you can keep visitors actively interacting with your site while they wait for a page to load.<\/li>\n<li><b>Flow<\/b>: As you tell your website\u2019s story, you need to have smooth transitions from one page to the next. Rather than rely on a simple page change, use a transitional element that will keep the story moving seamlessly along.<\/li>\n<li><b>Suspense<\/b>: There are certain transitions that aim to create a sort of \u201cpop\u201d or surprise as visitors encounter them\u2014these work especially well for single page websites that reveal different \u201cpages\u201d via a scroll.<\/li>\n<li><b>Modernization<\/b>: Websites with the right kind of animation appear more modern than their static counterparts, whether it\u2019s through the use of video, parallax scrolling, and, in this case, page transitions.<\/li>\n<\/ul>\n<p>If you want to minimize any gaps in UX caused by a slower-loading site or just want to give visitors something fun to do as they move through your website, page-to-page animation is a great way to hold their engagement and increase your conversion rate. Do keep in mind though that execution is of the utmost importance.<\/p>\n<p>Here are some tips to help keep you on track when approaching page transitions:<\/p>\n<ol>\n<li>A website littered with animations (for page transitions or otherwise) may be just as distracting and unprofessional looking as an ill-designed website.<\/li>\n<li>Try to keep the amount of animation on your website to a minimum so that when it does occur between pages, it has the intended effect of holding your visitors\u2019 attention.<\/li>\n<li>Page transitions should not be jarring. They should aid in the smooth transition from one part of your website to the next and be relevant to the overall story.<\/li>\n<li>It should be clear that an animation is guiding visitors from one part of the website to another. There should be no confusion as to what they\u2019re looking at or what to do next, and there should always be a sense of continuity between two pages.<\/li>\n<li>Transition animations don\u2019t have to always be over-the-top. If you want to use a bunny hopping across the page to indicate loading progress, go for it.<\/li>\n<li>Keep your page transitions consistent in style. So if you\u2019ve used a storybook page flip between two pages, you should maintain that throughout the site.<\/li>\n<li>Ensure that the speed of the animation makes sense for what you want it to accomplish. Slower transitions tend to be less shocking and more effective at controlling visitors\u2019 focus. Fast animations, however, tend to shake visitors out of one state (almost like a wake-up call) and bring them into another related state.<\/li>\n<\/ol>\n<p>The moral of the story?<\/p>\n<p>Choose your animations carefully. If not used properly, they can do as much harm to your website\u2019s reception and business\u2019s reputation as a poor design choice. Visitors shouldn\u2019t see a page transition and realize you\u2019re hiding a slow-loading page behind it nor should they be confused by why it\u2019s there in the first place. The transition should enhance the experience of traveling through your website and motivate visitors to wait and see what else you have to offer.<\/p>\n<h2 id=\"page-transition-animation\">Page Transition Animation<\/h2>\n<p>Before we discuss how to go about building page transitions in WordPress, let\u2019s take a moment to review the possibilities.<\/p>\n<h3>The Spinner<\/h3>\n<p>For the most basic of page transitions, you can rely on a singular spinning or rotating object in the middle of the page to let visitors know something is coming next.<\/p>\n<p style=\"text-align: center;\"><video loop muted autoplay playsinline class='dev-html5-video'><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/domani-transition-sm.webm\" type=\"video\/webm\"><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/domani-transition-sm.mp4\" type=\"video\/mp4\"><\/video><\/p>\n<p style=\"text-align: center;\"><small>Domani is a digital agency specializing in strategy, marketing, and technology.<\/small><\/p>\n<h3>Smooth Slider<\/h3>\n<p>For websites with a minimalistic design, simpler page transitions will work best. A smooth slide will provide you with a simple, yet the clean transition from one page to the next while adding an interesting touch of movement to your site.<\/p>\n<p style=\"text-align: center;\"><video loop muted autoplay playsinline class='dev-html5-video'><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/handy-testen.webm\" type=\"video\/webm\"><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/handy-testen.mp4\" type=\"video\/mp4\"><\/video><\/p>\n<p style=\"text-align: center;\"><small>This fun websites tests how well you know tools.<\/small><\/p>\n<h3>Page Flip<\/h3>\n<p>How do you envision your pages moving? If you\u2019re building an author\u2019s website, you may want the page transitions to mimic the flip of a book\u2019s page.<\/p>\n<h3>3D Objects<\/h3>\n<p>Perhaps your website serves a creative, yet more structured artist type (like a designer or developer). A <a href=\"http:\/\/codepen.io\/robbue\/full\/ugByC\" target=\"_blank\">3D page rotation<\/a> would probably work better.<\/p>\n<h3>Smoke Screen<\/h3>\n<p>If your website leans more toward the dramatic, you could add a smoke screen or other nature-type transitional element (whatever relates best to your site\u2019s overall style).<\/p>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/train-robber.png\" alt=\"Train Robber is a virtual reality agency based in Los Angeles and New York.\" width=\"1364\" height=\"657\" \/><figcaption class=\"wp-caption-text\">Train Robber is a virtual reality agency based in Los Angeles and New York.<\/figcaption><\/figure>\n<\/div>\n<h3>Reconstruction<\/h3>\n<p>Most commonly seen on parallax scrolling websites, \u201cpage\u201d transitions can be as simple as the deconstruction and reconstruction of the central piece of the website. With these sorts of transitions, you\u2019ll always want to make sure the reconstruction takes place on the same part of the screen so visitors don\u2019t have to work to find it.<\/p>\n<p style=\"text-align: center;\"><video loop muted autoplay playsinline class='dev-html5-video'><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/in-pieces.webm\" type=\"video\/webm\"><source src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/in-pieces.mp4\" type=\"video\/mp4\"><\/video><\/p>\n<p style=\"text-align: center;\"><small>In Pieces is an interactive exhibition turned study into 30 of the world&#8217;s most interesting but unfortunately endangered species.<\/small><\/p>\n<h3>Elemental Fade<\/h3>\n<p>Page fades tend to be more\u00a0subtle\u00a0transitions in general. However, for some extra pop, you can take the idea of reconstruction above and use it to fade in the individual elements of the next page.<\/p>\n<p>Check out <a href=\"https:\/\/www.loflorecords.com\/musicals\" target=\"_blank\">Loflo Records<\/a> for a beautiful example of page fades.<\/p>\n<div  class=\"wpdui-pic-large   \" >\n<figure class=\"wp-caption aligncenter\" data-caption=\"true\"><img loading=\"lazy\" decoding=\"async\" class=\"attachment-1364x1364 size-1364x1364\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/08\/loflo-records.png\" alt=\"Loflo Records, the online home of singer-songwriter Jane McNearly, is a beautiful example of an elemental fade.\" width=\"1364\" height=\"664\" \/><figcaption class=\"wp-caption-text\">Loflo Records, the online home of singer-songwriter Jane McNearly, is a beautiful example of an elemental fade.<\/figcaption><\/figure>\n<\/div>\n<h2 id=\"basic-page-animation\">Basic Page Animation<\/h2>\n<p>The examples above all demonstrate how page transitions work really well within the right setting and for the right company.<\/p>\n<ul>\n<li>The style matches the overall vibe of the website.<\/li>\n<li>The animation is simple and easy to focus on.<\/li>\n<li>The movement contributes to a seamless and logical flow from one page to the next (usually from top to bottom or left to right).<\/li>\n<\/ul>\n<p>If you\u2019re just getting started with page transitions, consider taking a look at this <a href=\"http:\/\/tympanus.net\/Development\/PageTransitions\/\" rel=\"noopener\" target=\"_blank\">collection of page transition styles<\/a>. They\u2019re all pretty basic in nature, but they do also provide enough variety in movement, direction, and style (especially the rotations) so that your website\u2019s animation can stand out from others.<\/p>\n<p>Remember: your goal here is to provide visitors with a seamless flow from one page to the next; not to overwhelm them with crazy-outlandish page transition effects. Sometimes, simpler styling is going to be the most effective choice for your website.<\/p>\n<p>Now, if you\u2019re ready, let\u2019s talk how you create these transitions.<\/p>\n\n<h2 id=\"page-animation-tools\">Page Animation Tools<\/h2>\n<p>When it comes to website animation, you can really only pull these effects off using CSS, HTML, and jQuery. If you\u2019re not comfortable making updates to scripts or coding, never fear. WordPress, of course, does have some tools available to help. It\u2019s important to note, however, that while there are WordPress plugins to help you animate page transitions, most are limited in what their capabilities are. So if you are more accustomed to relying on WordPress plugins and themes to help you build websites, just make sure to set your expectations accordingly.<\/p>\n<p>Regardless of your skill level in WordPress or coding, here are a few tools we\u2019d recommend for bringing some extra life to your page transitions.<\/p>\n<ul class=\"dev-tutorial-list\"><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">Page scroll to id<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/07\/Page-scroll-to-id-plugin-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"Page scroll to id image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>For smooth scrolling animation\u2014vertical, horizontal, or something a little more complicated than that\u2014this plugin will help you set that up. This also has a pretty comprehensive setup screen where you can make adjustments to the animation speed, scroll styling, target destination or page position, and more.<\/p>\n<p>This plugin may require some editing of CSS in order to get it working properly, so only use this plugin if you\u2019re comfortable making the needed changes.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in Page scroll to id?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/page-scroll-to-id\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">CSS Animations Library & Tutorial<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"172\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/07\/CSS-Page-Transitions-1-600x172.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"CSS Animations Library &amp; Tutorial image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>CSS animations are the new Flash, but they\u2019re much more lightweight and work across most browser types. When it comes to adding CSS animations to your WordPress website, there are a few ways you can accomplish this.<\/p>\n<ul>\n<li>You can edit your theme\u2019s stylesheet accordingly. In order to do this though, you\u2019ll need to know which properties to define and where to add them to your stylesheet. If you\u2019re going to go this route, you should just use the CSS Animate! Plugin instead as it will accomplish the same thing.<\/li>\n<li>You can download and use this\u00a0<a href=\"https:\/\/daneden.github.io\/animate.css\/\" rel=\"noopener\" target=\"_blank\">CSS3 library of animations<\/a>. You can test each of the effects out right on that page and decide which page transition effect you want before applying it to your website.<\/li>\n<li>Remember those basic page transition samples from earlier? Well, Tympanus has also created a fairly\u00a0<a href=\"http:\/\/tympanus.net\/codrops\/2013\/05\/07\/a-collection-of-page-transitions\/\" rel=\"noopener\" target=\"_blank\">simple tutorial<\/a>\u00a0you can use for creating these effects on your website along with source files for each of those animations.<\/li>\n<\/ul>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in CSS Animations Library & Tutorial?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"https:\/\/animate.style\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><li class=\"dev-tutorial-list__item\"><header class=\"dev-tutorial-list__item__header\"><h3 class=\"dev-tutorial-list__item__title\">jQuery Plugins and Tutorials<\/h3><\/header><section class=\"dev-tutorial-list__item__image\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"171\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2016\/07\/jQuery-plugins-600x171.png\" class=\"attachment-ratio-large size-ratio-large\" alt=\"jQuery Plugins and Tutorials image\" aria-hidden=\"true\" \/><\/section><!-- end dev-tutorial-list__item__image --><section class=\"dev-tutorial-list__item__content\"><p>If you prefer using jQuery and are looking for some more advanced page transitions, this is the route you will want to take. The Nino Dezign website has put together this\u00a0<a href=\"http:\/\/ninodezign.com\/20-jquery-plugin-for-page-transition-effects-with-css3\/\" rel=\"noopener\" target=\"_blank\">extremely useful list<\/a>\u00a0of JavaScript plugins and tutorials that you can use to attain some beautiful transition stylings.<\/p>\n<\/section><!-- end dev-tutorial-list__item__content --><footer class=\"dev-tutorial-list__item__footer\"><p>Interested in jQuery Plugins and Tutorials?<\/p><div class=\"dev-tutorial-list__item__cta\"><a target=\"_blank\" href=\"http:\/\/ninodezign.com\/20-jquery-plugin-for-page-transition-effects-with-css3\/\" class=\"dui-btn dui-btn--sm dui-btn--brand dev-btn--Details\">Details<\/a><\/div><!-- end dev-tutorial-list__item__cta --><\/footer><!-- end dev-tutorial-list__item__footer --><\/li><!-- end dev-tutorial-list__item --><\/ul><!-- end dev-tutorial-list -->\n<h2>Wrapping Up<\/h2>\n<p>Have you ever heard of the <a href=\"http:\/\/semanticstudios.com\/user_experience_design\/\" rel=\"noopener\" target=\"_blank\">User Experience Honeycomb<\/a> before? Basically, it lays out the seven UX qualities you\u2019ll always want associated with your website:<\/p>\n<ul>\n<li>Valuable<\/li>\n<li>Usable<\/li>\n<li>Findable<\/li>\n<li>Credible<\/li>\n<li>Accessible<\/li>\n<li>Desirable<\/li>\n<li>Useful<\/li>\n<\/ul>\n<p>Those characteristics are all very simple ideas, but they make a lot of sense in the context of web design and what we know works well with our online audience. They don\u2019t want fancy tricks and they don\u2019t want to be bogged down by unnecessary excess. This is true for your websites as a whole and it\u2019s especially true for page transitions.<\/p>\n<p>Your goal in establishing page transitions should be to further strengthen the UX and keep visitors engaged with each new page load. If you can keep them interested in your site with some eye-catching movements when they jump from page to page, you can cut down on that urge many of them may have to flee and give them a reason to be interested in and trust your well-built brand even more.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Okay, so you\u2019ve heard it before: humans have a shorter attention span than goldfish. If you think about it though, that\u2019s not really a fair comparison to make. Your pet goldfish probably only has a few interesting things to look at in your home. They might occasionally tune into whichever show or movie is playing [&hellip;]<\/p>\n","protected":false},"author":344989,"featured_media":158147,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[263],"tags":[10151,10509],"tutorials_categories":[],"class_list":["post-157941","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-animations","tag-transitions"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/157941","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/344989"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=157941"}],"version-history":[{"count":18,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/157941\/revisions"}],"predecessor-version":[{"id":214114,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/157941\/revisions\/214114"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/158147"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=157941"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=157941"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=157941"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=157941"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}