{"id":9023,"date":"2024-01-19T17:58:00","date_gmt":"2024-01-19T17:58:00","guid":{"rendered":"https:\/\/codehim.com\/?p=9023"},"modified":"2024-01-22T15:59:01","modified_gmt":"2024-01-22T10:59:01","slug":"stylish-search-box-in-html-css-code","status":"publish","type":"post","link":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/","title":{"rendered":"Stylish Search Box in HTML CSS Code"},"content":{"rendered":"<p>This HTML and CSS code creates a Stylish Search Box. It comes with a modern and attractive appearance. This code can be helpful for enhancing the design of your website&#8217;s search functionality.<\/p>\n<p>You just need to add an action attribute to the <a href=\"https:\/\/codehim.com\/bootstrap\/bootstrap-4-search-box-with-icon\/\" target=\"_blank\" rel=\"noopener\">search form<\/a> to enable search functionality on your blog\/website.<\/p>\n<h2>How to Create Stylish Search Box In HTML CSS Code<\/h2>\n<p>1. Start by creating the HTML structure for the search box. Replace the <code>\"seach-result-page\"<\/code> with your action URL where the search query will be handled on your server. You can customize the placeholder text and other attributes to match your website&#8217;s needs.<\/p>\n<pre class=\"prettyprint linenums lang-html\">&lt;form class=\"form-wrapper cf\" action=\"seach-result-page\"&gt;\r\n  \t&lt;input type=\"text\" placeholder=\"Search here...\" required&gt;\r\n\t  &lt;button type=\"submit\"&gt;Search&lt;\/button&gt;\r\n&lt;\/form&gt;<\/pre>\n<p>2. The magic happens in the CSS code, where we apply styles to make the search box look stylish. We use various CSS properties to achieve this, including borders, shadows, and transitions. Add the following CSS code in style.css or between <code>&lt;style&gt;<\/code> tag in your HTML document.<\/p>\n<pre class=\"prettyprint linenums lang-css\">.cf:before, .cf:after{\r\n      content:\"\";\r\n      display:table;\r\n    }\r\n    \r\n    .cf:after{\r\n      clear:both;\r\n    }\r\n\r\n    .cf{\r\n      zoom:1;\r\n    }\r\n\r\n    \/*-------------------------------------*\/\t\r\n    \r\n    .form-wrapper {\r\n        width: 450px;\r\n        padding: 15px;\r\n        margin: 150px auto 50px auto;\r\n        background: #444;\r\n        background: rgba(0,0,0,.2);\r\n        -moz-border-radius: 10px;\r\n        -webkit-border-radius: 10px;\r\n        border-radius: 10px;\r\n        -moz-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);\r\n        -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);\r\n        box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);\r\n    }\r\n    \r\n    .form-wrapper input {\r\n        width: 330px;\r\n        height: 20px;\r\n        padding: 10px 5px;\r\n        float: left;    \r\n        font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';\r\n        border: 0;\r\n        background: #eee;\r\n        -moz-border-radius: 3px 0 0 3px;\r\n        -webkit-border-radius: 3px 0 0 3px;\r\n        border-radius: 3px 0 0 3px;      \r\n    }\r\n    \r\n    .form-wrapper input:focus {\r\n        outline: 0;\r\n        background: #fff;\r\n        -moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;\r\n        -webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;\r\n        box-shadow: 0 0 2px rgba(0,0,0,.8) inset;\r\n    }\r\n    \r\n    .form-wrapper input::-webkit-input-placeholder {\r\n       color: #999;\r\n       font-weight: normal;\r\n       font-style: italic;\r\n    }\r\n    \r\n    .form-wrapper input:-moz-placeholder {\r\n        color: #999;\r\n        font-weight: normal;\r\n        font-style: italic;\r\n    }\r\n    \r\n    .form-wrapper input:-ms-input-placeholder {\r\n        color: #999;\r\n        font-weight: normal;\r\n        font-style: italic;\r\n    }    \r\n    \r\n    .form-wrapper button {\r\n\t\toverflow: visible;\r\n        position: relative;\r\n        float: right;\r\n        border: 0;\r\n        padding: 0;\r\n        cursor: pointer;\r\n        height: 40px;\r\n        width: 110px;\r\n        font: bold 15px\/40px 'lucida sans', 'trebuchet MS', 'Tahoma';\r\n        color: #fff;\r\n        text-transform: uppercase;\r\n        background: #d83c3c;\r\n        -moz-border-radius: 0 3px 3px 0;\r\n        -webkit-border-radius: 0 3px 3px 0;\r\n        border-radius: 0 3px 3px 0;      \r\n        text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);\r\n    }   \r\n      \r\n    .form-wrapper button:hover{\t\t\r\n        background: #e54040;\r\n    }\t\r\n      \r\n    .form-wrapper button:active,\r\n    .form-wrapper button:focus{   \r\n        background: #c42f2f;    \r\n    }\r\n    \r\n    .form-wrapper button:before {\r\n        content: '';\r\n        position: absolute;\r\n        border-width: 8px 8px 8px 0;\r\n        border-style: solid solid solid none;\r\n        border-color: transparent #d83c3c transparent;\r\n        top: 12px;\r\n        left: -6px;\r\n    }\r\n    \r\n    .form-wrapper button:hover:before{\r\n        border-right-color: #e54040;\r\n    }\r\n    \r\n    .form-wrapper button:focus:before{\r\n        border-right-color: #c42f2f;\r\n    }    \r\n    \r\n    .form-wrapper button::-moz-focus-inner {\r\n        border: 0;\r\n        padding: 0;\r\n    }\r\n.byline p{\r\n  text-align:center;\r\n  color:#c6c6c6;\r\n  font: bold 18px Arial, Helvetica, Sans-serif;\r\n  text-shadow: 0 2px 3px rgba(0,0,0,0.1);\r\n}\r\n\r\n.byline p a{\r\n  color:#d83c3c;\r\n  text-decoration:none;\r\n}<\/pre>\n<p>Feel free to customize the CSS code to match your website&#8217;s color scheme and design preferences. You can adjust the box&#8217;s width, fonts, and colors to make it uniquely yours.<\/p>\n<p>That&#8217;s all! hopefully, you have successfully integrated this stylish search box into your web project. If you have any questions or suggestions, feel free to comment below.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This HTML and CSS code creates a Stylish Search Box. It comes with a modern and attractive appearance. This code&#8230;<\/p>\n","protected":false},"author":1,"featured_media":9041,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[97],"tags":[],"class_list":["post-9023","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>Stylish Search Box in HTML CSS Code &#8212; CodeHim<\/title>\n<meta name=\"description\" content=\"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. 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\/stylish-search-box-in-html-css-code\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Stylish Search Box in HTML CSS Code &#8212; CodeHim\" \/>\n<meta property=\"og:description\" content=\"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. You can view demo and download the source code.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\" \/>\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-19T17:58:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-22T10:59:01+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.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\/stylish-search-box-in-html-css-code\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\"},\"author\":{\"name\":\"Asif Mughal\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\"},\"headline\":\"Stylish Search Box in HTML CSS Code\",\"datePublished\":\"2024-01-19T17:58:00+00:00\",\"dateModified\":\"2024-01-22T10:59:01+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\"},\"wordCount\":217,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png\",\"articleSection\":[\"Text &amp; Input\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\",\"url\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\",\"name\":\"Stylish Search Box in HTML CSS Code &#8212; CodeHim\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png\",\"datePublished\":\"2024-01-19T17:58:00+00:00\",\"dateModified\":\"2024-01-22T10:59:01+00:00\",\"description\":\"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. You can view demo and download the source code.\",\"breadcrumb\":{\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage\",\"url\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png\",\"contentUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png\",\"width\":1280,\"height\":960,\"caption\":\"Stylish Search Box in HTML CSS Code\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#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\":\"Stylish Search Box in HTML CSS Code\"}]},{\"@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":"Stylish Search Box in HTML CSS Code &#8212; CodeHim","description":"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. 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\/stylish-search-box-in-html-css-code\/","og_locale":"en_US","og_type":"article","og_title":"Stylish Search Box in HTML CSS Code &#8212; CodeHim","og_description":"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. You can view demo and download the source code.","og_url":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/","og_site_name":"CodeHim","article_publisher":"https:\/\/www.facebook.com\/codehimofficial","article_published_time":"2024-01-19T17:58:00+00:00","article_modified_time":"2024-01-22T10:59:01+00:00","og_image":[{"width":1280,"height":960,"url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.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\/stylish-search-box-in-html-css-code\/#article","isPartOf":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/"},"author":{"name":"Asif Mughal","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed"},"headline":"Stylish Search Box in HTML CSS Code","datePublished":"2024-01-19T17:58:00+00:00","dateModified":"2024-01-22T10:59:01+00:00","mainEntityOfPage":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/"},"wordCount":217,"commentCount":0,"publisher":{"@id":"https:\/\/codehim.com\/#organization"},"image":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png","articleSection":["Text &amp; Input"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/","url":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/","name":"Stylish Search Box in HTML CSS Code &#8212; CodeHim","isPartOf":{"@id":"https:\/\/codehim.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage"},"image":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png","datePublished":"2024-01-19T17:58:00+00:00","dateModified":"2024-01-22T10:59:01+00:00","description":"Here is a free code snippet to create a Stylish Search Box in HTML CSS Code. You can view demo and download the source code.","breadcrumb":{"@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#primaryimage","url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png","contentUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Stylish-Search-Box-in-HTML-CSS-Code.png","width":1280,"height":960,"caption":"Stylish Search Box in HTML CSS Code"},{"@type":"BreadcrumbList","@id":"https:\/\/codehim.com\/text-input\/stylish-search-box-in-html-css-code\/#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":"Stylish Search Box in HTML CSS Code"}]},{"@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":1597,"_links":{"self":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9023","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=9023"}],"version-history":[{"count":0,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9023\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media\/9041"}],"wp:attachment":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media?parent=9023"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/categories?post=9023"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/tags?post=9023"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}