{"id":9516,"date":"2024-01-09T18:03:00","date_gmt":"2024-01-09T18:03:00","guid":{"rendered":"https:\/\/codehim.com\/?p=9516"},"modified":"2024-01-22T16:05:04","modified_gmt":"2024-01-22T11:05:04","slug":"check-multiple-checkboxes-in-javascript","status":"publish","type":"post","link":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/","title":{"rendered":"Check Multiple Checkboxes in JavaScript"},"content":{"rendered":"<p>This JavaScript code facilitates checking multiple checkboxes by holding Shift. When a user clicks a checkbox, holds Shift, and clicks another checkbox further down, it automatically <a href=\"https:\/\/codehim.com\/text-input\/toggle-select-all-checkbox-javascript\/\" target=\"_blank\" rel=\"noopener\">checks all the checkboxes<\/a> in between.<\/p>\n<p>The script employs event listeners to detect checkbox clicks and uses the Shift key to determine the range for multiple selections, enhancing the user experience in selecting items quickly and efficiently.<\/p>\n<h2>How to Create &#8220;Check Multiple Checkboxes&#8221; Functionality In JavaScript<\/h2>\n<p>1. First, let&#8217;s set up our HTML structure, which includes a list of checkboxes that users can select.<\/p>\n<pre class=\"prettyprint linenums lang-html\">&lt;h1&gt;Check Multiple Checkboxes&lt;\/h1&gt; \r\n&lt;h2&gt;Check one item, hold down SHIFT, check another item&lt;\/h2&gt;\r\n\r\n  &lt;div class=\"inbox post-it-note\"&gt;\r\n    &lt;div class=\"item\"&gt;\r\n      &lt;input type=\"checkbox\"&gt;\r\n      &lt;p&gt;Message&lt;\/p&gt;\r\n    &lt;\/div&gt;\r\n    &lt;div class=\"item\"&gt;\r\n      &lt;input type=\"checkbox\"&gt;\r\n      &lt;p&gt;Message&lt;\/p&gt;\r\n    &lt;\/div&gt;\r\n    &lt;div class=\"item\"&gt;\r\n      &lt;input type=\"checkbox\"&gt;\r\n      &lt;p&gt;Message&lt;\/p&gt;\r\n    &lt;\/div&gt;\r\n    &lt;div class=\"item\"&gt;\r\n      &lt;input type=\"checkbox\"&gt;\r\n      &lt;p&gt;Message&lt;\/p&gt;\r\n    &lt;\/div&gt;\r\n    &lt;div class=\"item\"&gt;\r\n      &lt;input type=\"checkbox\"&gt;\r\n      &lt;p&gt;Message&lt;\/p&gt;\r\n    &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n  &lt;\/div&gt;<\/pre>\n<p>2. Use the following CSS code to style the checkboxes. (Optional)<\/p>\n<pre class=\"prettyprint linenums lang-css\">@import url(\"https:\/\/fonts.googleapis.com\/css?family=Exo\");\r\n\r\nhtml {\r\n  background-color: #00acc1;\r\n  font-family: 'Exo', sans-serif;\r\n}\r\nh1 {\r\n  text-align: center;\r\n  font-size: 32px;\r\n}\r\nh2{\r\n  text-align: center;\r\n  font-size: 18px;\r\n  font-weight: 400;\r\n}\r\n.inbox {\r\n  max-width:400px;\r\n  margin:50px auto;\r\n  background:white;\r\n  border-radius:5px;\r\n  box-shadow:10px 10px 0 rgba(0,0,0,0.1);\r\n}\r\n\r\n.post-it-note {\r\n  padding: 2em;\r\n  background: #ffd707;\r\n  position: relative;\r\n  min-height: 10em;\r\n}\r\n\r\n.post-it-note:after {\r\n  content: \"\";\r\n  position: absolute;\r\n  bottom: -2em;\r\n  left: 0;\r\n  right: 2em;\r\n  border-width: 1em;\r\n  border-style: solid;\r\n  border-color: #ffd707;\r\n}\r\n\r\n.post-it-note:before {\r\n  content: \"\";\r\n  position: absolute;\r\n  bottom: -2em;\r\n  right: 0;\r\n  border-width: 2em 2em 0 0;\r\n  border-style: solid;\r\n  border-color: #d3b100 transparent;\r\n}\r\n\r\n.item {\r\n  display:flex;\r\n  align-items:center;\r\n  border-bottom: 1px solid #F1F1F1;\r\n}\r\n.item:last-child {\r\n  border-bottom:0;\r\n}\r\ninput:checked + p {\r\n  background: #ffd707;\r\n  text-decoration: line-through;\r\n}\r\ninput[type=\"checkbox\"] {\r\n  margin:20px;\r\n}\r\np {\r\n  margin:0;\r\n  padding:20px;\r\n  transition:background 0.2s;\r\n  flex:1;\r\n  font-family:'helvetica neue';\r\n  font-size: 20px;\r\n  font-weight: 200;\r\n  border-left: 1px solid #D1E2FF;\r\n}<\/pre>\n<p>3. Finally, add the following JavaScript code to your project. It\u00a0adds the functionality to check multiple checkboxes using the Shift key. When a user clicks a checkbox, holds Shift, and clicks another checkbox further down, all checkboxes in between are automatically checked.<\/p>\n<pre class=\"prettyprint linenums lang-js\">const checkboxes = document.querySelectorAll('.inbox input[type=\"checkbox\"]');\r\nlet lastChecked;\r\nfunction handleCheck(e) {\r\n  \/\/ Check if they had the shift key down\r\n  \/\/ AND check that they are checking it\r\n  let inBetween = false;\r\n  if (e.shiftKey &amp;&amp; this.checked) {\r\n    \/\/ go ahead and do what we please\r\n    \/\/ loop over every single checkbox\r\n    checkboxes.forEach(checkbox =&gt; {\r\n      console.log(checkbox);\r\n      if (checkbox === this || checkbox === lastChecked) {\r\n        inBetween = !inBetween;\r\n        console.log('Starting to check them inbetween!');\r\n      }\r\n      if (inBetween) {\r\n        checkbox.checked = true;\r\n      }\r\n    });\r\n  }\r\n  lastChecked = this;\r\n}\r\ncheckboxes.forEach(checkbox =&gt; checkbox.addEventListener('click', handleCheck));<\/pre>\n<p>That&#8217;s all! hopefully, you have successfully created a functionality to check multiple checkboxes using JavaScript. If you have any questions or suggestions, feel free to comment below.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This JavaScript code facilitates checking multiple checkboxes by holding Shift. When a user clicks a checkbox, holds Shift, and clicks&#8230;<\/p>\n","protected":false},"author":1,"featured_media":9527,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[97],"tags":[],"class_list":["post-9516","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-text-input"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Check Multiple Checkboxes in JavaScript &#8212; CodeHim<\/title>\n<meta name=\"description\" content=\"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Check Multiple Checkboxes in JavaScript &#8212; CodeHim\" \/>\n<meta property=\"og:description\" content=\"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"CodeHim\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codehimofficial\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-09T18:03:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-22T11:05:04+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"960\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Asif Mughal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:site\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Asif Mughal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\"},\"author\":{\"name\":\"Asif Mughal\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\"},\"headline\":\"Check Multiple Checkboxes in JavaScript\",\"datePublished\":\"2024-01-09T18:03:00+00:00\",\"dateModified\":\"2024-01-22T11:05:04+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\"},\"wordCount\":175,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png\",\"articleSection\":[\"Text &amp; Input\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\",\"url\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\",\"name\":\"Check Multiple Checkboxes in JavaScript &#8212; CodeHim\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png\",\"datePublished\":\"2024-01-09T18:03:00+00:00\",\"dateModified\":\"2024-01-22T11:05:04+00:00\",\"description\":\"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.\",\"breadcrumb\":{\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage\",\"url\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png\",\"contentUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png\",\"width\":1280,\"height\":960,\"caption\":\"Check Multiple Checkboxes in JavaScript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/codehim.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Text &amp; Input\",\"item\":\"https:\/\/codehim.com\/category\/text-input\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Check Multiple Checkboxes in JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codehim.com\/#website\",\"url\":\"https:\/\/codehim.com\/\",\"name\":\"CodeHim\",\"description\":\"Web Design Code Snippets\",\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"alternateName\":\"Web Design Codes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codehim.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/codehim.com\/#organization\",\"name\":\"CodeHim - Web Design Code & Scripts\",\"url\":\"https:\/\/codehim.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\",\"url\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"contentUrl\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"width\":280,\"height\":280,\"caption\":\"CodeHim - Web Design Code & Scripts\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/codehimofficial\",\"https:\/\/x.com\/CodeHimOfficial\",\"https:\/\/www.instagram.com\/codehim\/\",\"https:\/\/www.linkedin.com\/company\/codehim\",\"https:\/\/co.pinterest.com\/codehim\/\",\"https:\/\/www.youtube.com\/@codehim\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\",\"name\":\"Asif Mughal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"caption\":\"Asif Mughal\"},\"description\":\"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.\",\"sameAs\":[\"https:\/\/codehim.com\"],\"url\":\"https:\/\/codehim.com\/author\/asif-mughal\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Check Multiple Checkboxes in JavaScript &#8212; CodeHim","description":"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.","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:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/","og_locale":"en_US","og_type":"article","og_title":"Check Multiple Checkboxes in JavaScript &#8212; CodeHim","og_description":"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.","og_url":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/","og_site_name":"CodeHim","article_publisher":"https:\/\/www.facebook.com\/codehimofficial","article_published_time":"2024-01-09T18:03:00+00:00","article_modified_time":"2024-01-22T11:05:04+00:00","og_image":[{"width":1280,"height":960,"url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png","type":"image\/png"}],"author":"Asif Mughal","twitter_card":"summary_large_image","twitter_creator":"@CodeHimOfficial","twitter_site":"@CodeHimOfficial","twitter_misc":{"Written by":"Asif Mughal","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#article","isPartOf":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/"},"author":{"name":"Asif Mughal","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed"},"headline":"Check Multiple Checkboxes in JavaScript","datePublished":"2024-01-09T18:03:00+00:00","dateModified":"2024-01-22T11:05:04+00:00","mainEntityOfPage":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/"},"wordCount":175,"commentCount":0,"publisher":{"@id":"https:\/\/codehim.com\/#organization"},"image":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png","articleSection":["Text &amp; Input"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/","url":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/","name":"Check Multiple Checkboxes in JavaScript &#8212; CodeHim","isPartOf":{"@id":"https:\/\/codehim.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage"},"image":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png","datePublished":"2024-01-09T18:03:00+00:00","dateModified":"2024-01-22T11:05:04+00:00","description":"Here is a free code snippet to create a Check Multiple Checkboxes in JavaScript. You can view demo and download the source code.","breadcrumb":{"@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#primaryimage","url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png","contentUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Check-Multiple-Checkboxes-in-JavaScript.png","width":1280,"height":960,"caption":"Check Multiple Checkboxes in JavaScript"},{"@type":"BreadcrumbList","@id":"https:\/\/codehim.com\/text-input\/check-multiple-checkboxes-in-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codehim.com\/"},{"@type":"ListItem","position":2,"name":"Text &amp; Input","item":"https:\/\/codehim.com\/category\/text-input\/"},{"@type":"ListItem","position":3,"name":"Check Multiple Checkboxes in JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/codehim.com\/#website","url":"https:\/\/codehim.com\/","name":"CodeHim","description":"Web Design Code Snippets","publisher":{"@id":"https:\/\/codehim.com\/#organization"},"alternateName":"Web Design Codes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codehim.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/codehim.com\/#organization","name":"CodeHim - Web Design Code & Scripts","url":"https:\/\/codehim.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/","url":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","contentUrl":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","width":280,"height":280,"caption":"CodeHim - Web Design Code & Scripts"},"image":{"@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codehimofficial","https:\/\/x.com\/CodeHimOfficial","https:\/\/www.instagram.com\/codehim\/","https:\/\/www.linkedin.com\/company\/codehim","https:\/\/co.pinterest.com\/codehim\/","https:\/\/www.youtube.com\/@codehim"]},{"@type":"Person","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed","name":"Asif Mughal","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","caption":"Asif Mughal"},"description":"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.","sameAs":["https:\/\/codehim.com"],"url":"https:\/\/codehim.com\/author\/asif-mughal\/"}]}},"views":1274,"_links":{"self":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9516","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/comments?post=9516"}],"version-history":[{"count":0,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9516\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media\/9527"}],"wp:attachment":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media?parent=9516"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/categories?post=9516"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/tags?post=9516"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}