{"id":62570,"date":"2026-10-13T15:24:15","date_gmt":"2026-10-13T09:54:15","guid":{"rendered":"https:\/\/www.quickonlinetips.com\/archives\/?p=62570"},"modified":"2026-10-13T17:11:21","modified_gmt":"2026-10-13T11:41:21","slug":"fix-navbar-top-bottom","status":"publish","type":"post","link":"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/","title":{"rendered":"Use CSS to Fix a Navbar to the Top or Bottom Without JavaScript"},"content":{"rendered":"<p>Want a CSS fixed navbar that stays at the top (or bottom) of the screen while visitors scroll, without loading a single line of JavaScript? Modern CSS makes it easy. Years ago, sticky menus needed jQuery scroll listeners that recalculated offsets on every scroll event. Today one or two CSS properties do the job, they work in every modern browser, and they don&#8217;t slow your page down. Here&#8217;s how to fix a navbar to the top or bottom of the page with pure CSS, and how to avoid the common problems.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-63625\" src=\"https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom-1024x538.webp\" alt=\"CSS fixed navbar at top or bottom without JavaScript\" width=\"760\" height=\"399\" srcset=\"https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom-1024x538.webp 1024w, https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom-300x158.webp 300w, https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom-150x79.webp 150w, https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom-768x403.webp 768w, https:\/\/www.quickonlinetips.com\/archives\/wp-content\/uploads\/css-fixed-navbar-top-bottom.webp 1200w\" sizes=\"(max-width: 760px) 100vw, 760px\" \/><\/p>\n<p><strong>Quick answer:<\/strong> For a top navbar, use <code>position: sticky; top: 0; z-index: 100;<\/code> on the <code>&lt;nav&gt;<\/code>. It stays in the page flow and sticks once you scroll past it. For a bottom bar, use <code>position: fixed; bottom: 0; left: 0; right: 0;<\/code> and add bottom padding to the <code>&lt;body&gt;<\/code> so the bar doesn&#8217;t cover your content. No JavaScript is needed for either.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_88 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6ace1ccb95abd\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"ez-toc-cssicon\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #1a202c;color:#1a202c\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #1a202c;color:#1a202c\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6ace1ccb95abd\" checked aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Sticky_vs_fixed_which_CSS_position_should_you_use\" >Sticky vs fixed: which CSS position should you use?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#How_to_fix_a_navbar_to_the_top_with_CSS\" >How to fix a navbar to the top with CSS<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Method_1_position_sticky_recommended\" >Method 1: position: sticky (recommended)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Method_2_position_fixed\" >Method 2: position: fixed<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#How_to_fix_a_navbar_to_the_bottom_with_CSS\" >How to fix a navbar to the bottom with CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Show_the_bottom_bar_only_on_mobile\" >Show the bottom bar only on mobile<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Fix_anchor_links_hidden_under_a_sticky_header\" >Fix anchor links hidden under a sticky header<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Why_position_sticky_sometimes_doesnt_work\" >Why position: sticky sometimes doesn&#8217;t work<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Is_a_fixed_navbar_good_for_SEO_and_page_speed\" >Is a fixed navbar good for SEO and page speed?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Frequently_asked_questions\" >Frequently asked questions<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#How_do_I_make_a_navbar_fixed_to_the_top_without_JavaScript\" >How do I make a navbar fixed to the top without JavaScript?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#What_is_the_difference_between_sticky_and_fixed_in_CSS\" >What is the difference between sticky and fixed in CSS?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Why_is_my_fixed_navbar_covering_my_content\" >Why is my fixed navbar covering my content?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Does_position_sticky_work_on_all_browsers\" >Does position: sticky work on all browsers?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.quickonlinetips.com\/archives\/2026\/10\/fix-navbar-top-bottom\/#Can_I_fix_a_navbar_to_both_the_top_and_the_bottom\" >Can I fix a navbar to both the top and the bottom?<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Sticky_vs_fixed_which_CSS_position_should_you_use\"><\/span>Sticky vs fixed: which CSS position should you use?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>CSS gives you two ways to pin a navigation bar to the screen:<\/p>\n<ul>\n<li><strong><code>position: fixed<\/code><\/strong> removes the element from the normal page flow and pins it to the viewport. It never moves, but the content behind it slides underneath, so you must reserve space for it with padding.<\/li>\n<li><strong><code>position: sticky<\/code><\/strong> keeps the element in the normal flow until you scroll to a set offset (such as <code>top: 0<\/code>), then it sticks. Because it still takes up space, nothing hides behind it and you don&#8217;t need any padding fix.<\/li>\n<\/ul>\n<p>For most sites, <strong>sticky is the better choice for a top navbar<\/strong>, and <strong>fixed is the better choice for a bottom bar<\/strong>. Both are supported in all current versions of Chrome, Edge, Firefox and Safari, as the <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/position\" target=\"_blank\" rel=\"noopener\">MDN position reference<\/a> shows.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"How_to_fix_a_navbar_to_the_top_with_CSS\"><\/span>How to fix a navbar to the top with CSS<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"Method_1_position_sticky_recommended\"><\/span>Method 1: position: sticky (recommended)<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Here&#8217;s a simple header navigation:<\/p>\n<pre><code>&lt;nav class=\"topnav\"&gt;\r\n  &lt;a href=\"\/\"&gt;Home&lt;\/a&gt;\r\n  &lt;a href=\"\/blog\/\"&gt;Blog&lt;\/a&gt;\r\n  &lt;a href=\"\/about\/\"&gt;About&lt;\/a&gt;\r\n&lt;\/nav&gt;<\/code><\/pre>\n<p>Add this CSS to make it a sticky navbar:<\/p>\n<pre><code>.topnav {\r\n  position: sticky;\r\n  top: 0;\r\n  z-index: 100;\r\n  background: #142540;\r\n  padding: 12px 16px;\r\n}\r\n.topnav a {\r\n  color: #fff;\r\n  margin-right: 16px;\r\n  text-decoration: none;\r\n}<\/code><\/pre>\n<p>That&#8217;s it. The navbar scrolls normally with any logo or banner above it, then locks to the top of the screen. The <code>z-index<\/code> keeps it above images and other content, and the solid <code>background<\/code> stops text showing through it.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Method_2_position_fixed\"><\/span>Method 2: position: fixed<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>If you want the navbar pinned from the very first pixel, use <code>position: fixed<\/code>:<\/p>\n<pre><code>.topnav {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 100;\r\n  height: 56px;\r\n}\r\nbody {\r\n  padding-top: 56px; \/* same as the navbar height *\/\r\n}<\/code><\/pre>\n<p>The <code>padding-top<\/code> on the body is essential. Without it, the first 56 pixels of your page (usually the heading) will hide behind the navbar.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"How_to_fix_a_navbar_to_the_bottom_with_CSS\"><\/span>How to fix a navbar to the bottom with CSS<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>A bottom navigation bar works well on mobile, where thumbs reach the bottom of the screen more easily. Use <code>position: fixed<\/code> with <code>bottom: 0<\/code>:<\/p>\n<pre><code>.bottomnav {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 100;\r\n  display: flex;\r\n  justify-content: space-around;\r\n  background: #142540;\r\n  padding: 10px 0;\r\n  padding-bottom: calc(10px + env(safe-area-inset-bottom));\r\n}\r\nbody {\r\n  padding-bottom: 64px;\r\n}<\/code><\/pre>\n<p>Two details matter here:<\/p>\n<ul>\n<li><strong>Body padding:<\/strong> <code>padding-bottom<\/code> on the body stops the bar from covering your footer and the last lines of content.<\/li>\n<li><strong>Safe area:<\/strong> <code>env(safe-area-inset-bottom)<\/code> adds extra space above the home indicator on iPhones and gesture-navigation Android phones, so your links stay tappable. For it to work, add <code>viewport-fit=cover<\/code> to your viewport meta tag: <code>&lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\"&gt;<\/code>. See <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/env\" target=\"_blank\" rel=\"noopener\">env() on MDN<\/a>.<\/li>\n<\/ul>\n<p>Add icons with a lightweight icon set (here&#8217;s <a href=\"https:\/\/www.quickonlinetips.com\/archives\/2013\/07\/add-icon-font-awesome\/\">how to add Font Awesome icons<\/a>) to make a mobile-app style bottom menu.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Show_the_bottom_bar_only_on_mobile\"><\/span>Show the bottom bar only on mobile<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>A bottom bar can feel odd on a wide desktop screen. Use a media query to show it only on small screens:<\/p>\n<pre><code>.bottomnav { display: none; }\r\n@media (max-width: 768px) {\r\n  .bottomnav { display: flex; }\r\n  body { padding-bottom: 64px; }\r\n}<\/code><\/pre>\n<h2><span class=\"ez-toc-section\" id=\"Fix_anchor_links_hidden_under_a_sticky_header\"><\/span>Fix anchor links hidden under a sticky header<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>When someone clicks a jump link (like a table of contents link), the browser scrolls the heading to the very top, where it hides under your fixed header. One line of CSS fixes this:<\/p>\n<pre><code>html {\r\n  scroll-padding-top: 70px; \/* navbar height plus a little space *\/\r\n}<\/code><\/pre>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/scroll-padding-top\" target=\"_blank\" rel=\"noopener\">scroll-padding-top<\/a> tells the browser to leave that much room when scrolling to an anchor. It&#8217;s another job that used to need JavaScript.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Why_position_sticky_sometimes_doesnt_work\"><\/span>Why position: sticky sometimes doesn&#8217;t work<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>If your sticky navbar won&#8217;t stick, check these common causes:<\/p>\n<ul>\n<li><strong>No offset set.<\/strong> Sticky needs <code>top<\/code>, <code>bottom<\/code>, <code>left<\/code> or <code>right<\/code>. Without <code>top: 0<\/code>, nothing happens.<\/li>\n<li><strong>A parent has overflow set.<\/strong> If any ancestor has <code>overflow: hidden<\/code>, <code>overflow: auto<\/code> or <code>overflow: scroll<\/code>, the navbar sticks inside that box instead of the page. Use <code>overflow: clip<\/code> on the parent instead if you only need to hide overflow.<\/li>\n<li><strong>The parent is too short.<\/strong> A sticky element only sticks within its parent. If the <code>&lt;nav&gt;<\/code> sits inside a short <code>&lt;header&gt;<\/code>, it scrolls away with the header. Make the header itself sticky, or move the nav outside it.<\/li>\n<li><strong>Flexbox or grid stretching.<\/strong> In a flex or grid container, add <code>align-self: flex-start<\/code> (or <code>align-self: start<\/code>) so the element isn&#8217;t stretched to the full height.<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Is_a_fixed_navbar_good_for_SEO_and_page_speed\"><\/span>Is a fixed navbar good for SEO and page speed?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Pure CSS sticky headers are better for performance than JavaScript versions. They don&#8217;t run code on every scroll, which keeps the page smooth and helps <a href=\"https:\/\/web.dev\/articles\/inp\" target=\"_blank\" rel=\"noopener\">Interaction to Next Paint (INP)<\/a>, one of Google&#8217;s Core Web Vitals. Using sticky instead of switching an element to fixed with JavaScript also avoids sudden layout jumps that hurt Cumulative Layout Shift.<\/p>\n<p>Keep the bar slim, though. A tall fixed header takes up a lot of a phone screen and can annoy readers. Around 50\u201360 pixels is plenty. If your site uses a lightweight framework like <a href=\"https:\/\/www.quickonlinetips.com\/archives\/2021\/11\/chota-micro-css-framework\/\">Chota CSS<\/a>, the same CSS works with its <code>nav<\/code> component. On WordPress, many themes, including Kadence and Astra, have a sticky header option built into the Customizer, so check there before adding your own code. If you do add custom CSS, here&#8217;s <a href=\"https:\/\/www.quickonlinetips.com\/archives\/2020\/02\/add-custom-css-wordpress-post-editor\/\">how to add custom CSS in WordPress<\/a>.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Frequently_asked_questions\"><\/span>Frequently asked questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"How_do_I_make_a_navbar_fixed_to_the_top_without_JavaScript\"><\/span>How do I make a navbar fixed to the top without JavaScript?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Add <code>position: sticky; top: 0; z-index: 100;<\/code> to the navbar. Or use <code>position: fixed; top: 0; width: 100%;<\/code> and add <code>padding-top<\/code> to the body equal to the navbar&#8217;s height.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"What_is_the_difference_between_sticky_and_fixed_in_CSS\"><\/span>What is the difference between sticky and fixed in CSS?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>A fixed element is always pinned to the viewport and removed from the page flow. A sticky element scrolls normally until it reaches its offset, then sticks, and it keeps its space in the layout.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Why_is_my_fixed_navbar_covering_my_content\"><\/span>Why is my fixed navbar covering my content?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><code>position: fixed<\/code> takes the navbar out of the page flow, so content moves up underneath it. Add <code>padding-top<\/code> (for a top bar) or <code>padding-bottom<\/code> (for a bottom bar) to the body, equal to the bar&#8217;s height. Or switch a top navbar to <code>position: sticky<\/code>.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Does_position_sticky_work_on_all_browsers\"><\/span>Does position: sticky work on all browsers?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Yes. It works in all current versions of Chrome, Edge, Firefox and Safari, on desktop and mobile. Only very old browsers such as Internet Explorer lack support.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Can_I_fix_a_navbar_to_both_the_top_and_the_bottom\"><\/span>Can I fix a navbar to both the top and the bottom?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Yes. Use a sticky top navbar for the main menu and a fixed bottom bar for mobile shortcuts. Just remember the body padding for the bottom bar, and keep both bars slim so readers still have room for content.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Fix a navbar to the top or bottom of the page with pure CSS using position: sticky or position: fixed. Code examples, mobile safe-area tips and fixes for sticky not working.<\/p>\n","protected":false},"author":4,"featured_media":63625,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"default","_kad_post_title":"default","_kad_post_layout":"default","_kad_post_sidebar_id":"","_kad_post_content_style":"default","_kad_post_vertical_padding":"default","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"categories":[6],"tags":[49],"class_list":["post-62570","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blogging","tag-tutorials"],"_links":{"self":[{"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/posts\/62570","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/comments?post=62570"}],"version-history":[{"count":2,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/posts\/62570\/revisions"}],"predecessor-version":[{"id":63626,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/posts\/62570\/revisions\/63626"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/media\/63625"}],"wp:attachment":[{"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/media?parent=62570"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/categories?post=62570"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.quickonlinetips.com\/archives\/wp-json\/wp\/v2\/tags?post=62570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}