Create Custom Dynamic WordPress Theme Development Tutorial

Rate this post

Create Custom Dynamic WordPress Theme Development Tutorial

Today, We want to share with you Create Custom Dynamic WordPress Theme Development Tutorial.
In this post we will show you how to create custom theme in wordpress step by step, hear for Create Custom Dynamic WordPress Theme Development Tutorial we will give you demo and example for implement.
In this post, we will learn about Create Custom WordPress Theme Web Design with Development with an example.

Building Custom WordPress Theme

Step : 1. A Blog Frontend

Before We start, let’s take a look at A WordPress default Custom WordPress Theme and see how it is structured. Take note of A elements (post header, and post title, wordpress website search form, all the menu navigation, last footer, etc.) For custom wordpress theme designer.

custom wordpress theme designer
custom wordpress theme designer

Step : 2. Photoshop Mockups

Based on A information gathered from A default Custom WordPress Theme, design a Photoshop mockup of wp website blog. and then We are using infinityknowledge (Thems Name), one of my free WordPress themes, as an example. Download A project.zip to see A Photoshop file.

wordpress themes for designers
wordpress themes for designers

Step : 3. HTML + CSS

After A wordpress HTML PSD design is done, Make a static HTML+CSS template of each page. You can use my infinityknowledge (Thems Name) HTML files in A project.zip to follow this Article. Extract A zip and take a look at A index.html, single.html, and page.html. Later in A Article, We shall use these HTML files and convert them into a Custom WordPress Theme.

wordpress theme designers
wordpress theme designers

Why Make a Static HTML File First?

Mainly because it shall make A development process a lot easier. We usually Make a HTML file such as a every template that We should, test it across all of The browsers, full validate both design HTML and CSS Interface markups, then all of The We have to do is cut source code & paste This code A WordPress code. By doing so, We do not have to worry about HTML or CSS bugs during my Custom WordPress Theme making process for wordpress themes for designers.

READ :  Gas/Electricity Supply Companies worldwide

Step : 4. How WordPress Theme Works

If We and then A default Custom WordPress Theme directory (wp-content/themes/default), We should see many PHP files (called template file) and one style.css file. When We are viewing A front page, WordPress actually uses several template files to generate A page (index.php << sidebar.php,header.php, and footer.php).

wordpress theme development
wordpress theme development

For more Information, check out webapplication Architecture and Template Hierarchy at Codex.

Step : 5. Duplicate A Template Files

Data source Copy A infinityknowledge (Thems Name) HTML directory into A wp-content/themes directory. Then, and then to A default Custom WordPress Theme directory, copy A comments.php and searchform.php file to A infinityknowledge (Thems Name) directory for wordpress theme designers.

wordpress theme template
wordpress theme template

Step : 6. Style.css

Go to A WordPress default Custom WordPress Theme directory, open A style.css file. Data source Copy A commented code at A top and paste This code it to A infinityknowledge (Thems Name) style.css file. Change A Custom WordPress Theme name and A author information as We desire.

create wordpress theme
create wordpress theme

Step : 7. Splitting A Files

After that We should to understand where to split A file into several files: Like as a header.php, sidebar.php, and footer.php. A image following shows a simplified version of my index file and how A markups should split.

wordpress page template
wordpress page template

Step : 8. Header.php

Open A index.html file. this source code Cut from A top to where A ends, paste This code it in a new PHP file, and save A file as header.php.

[php]
Go to A default Custom WordPress Theme directory, open A header.php. Data source Copy and interchange A tags where it requires PHP code (Template Tag): simple SEO Tags ,</p> <h2>, stylesheet, </p> <h1>, and p b , i and </p> <div class="description">.<br /> [/php]<br /> <figure id="attachment_128" aria-describedby="caption-attachment-128" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/8.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20173'%3E%3C/svg%3E" alt="how to create dynamic content in wordpress" width="300" height="173" class="size-medium wp-image-128" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/8-300x173.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/8-200x115.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/8-300x173.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/8-300x173.gif" alt="how to create dynamic content in wordpress" width="300" height="173" class="size-medium wp-image-128" srcset="https://infinityknow.com/wp-content/uploads/2018/06/8-300x173.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/8-200x115.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-128" class="wp-caption-text">how to create dynamic content in wordpress</figcaption></figure></p> <h3>Step : Navigation Menu (wp_list_pages)</h3> <p>[php]<br /> Change A </p> <li> tags in A <ul id="nav"> toethor<br /> [/php]</p> <h3>Step : 9. Sidebar.php</h3> <p>[php]<br /> Back to A index.html file, cut source code from where A </p> <form id="searchform"> start to A closing tag of </p> <div id="sidebar"> and paste This code it in a new PHP file, save it as sidebar.php.</p> <p>Change A </p> <form id="searchform"> wrap toethor .</p> <div class='code-block code-block-1' style='margin: 8px auto; text-align: center; display: block; clear: both;'> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-1944225715659599" data-ad-slot="9041170678"></ins> <script type="rocketlazyloadscript"> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <p>Change A category </p> <li> tags toethor <p>Change A archive </p> <li> tags toethor<br /> [/php]<br /> <figure id="attachment_129" aria-describedby="caption-attachment-129" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/9.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20115'%3E%3C/svg%3E" alt="how to create a website with wordpress" width="300" height="115" class="size-medium wp-image-129" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/9-300x115.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/9-200x77.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/9-300x115.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/9-300x115.gif" alt="how to create a website with wordpress" width="300" height="115" class="size-medium wp-image-129" srcset="https://infinityknow.com/wp-content/uploads/2018/06/9-300x115.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/9-200x77.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-129" class="wp-caption-text">how to create a website with wordpress</figcaption></figure></p> <h3>Step : 10. Footer.php</h3> <p>[php]<br /> Back to A index.html file, cut source code from A </p> <div id="footer"> tag to A end of and paste This code it in a new PHP file, save it as footer.php.<br /> [/php]<br /> <figure id="attachment_130" aria-describedby="caption-attachment-130" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/10.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20282'%3E%3C/svg%3E" alt="how to create dynamic web pages in wordpress" width="300" height="282" class="size-medium wp-image-130" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/10-300x282.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/10-200x188.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/10-300x282.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/10-300x282.gif" alt="how to create dynamic web pages in wordpress" width="300" height="282" class="size-medium wp-image-130" srcset="https://infinityknow.com/wp-content/uploads/2018/06/10-300x282.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/10-200x188.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-130" class="wp-caption-text">how to create dynamic web pages in wordpress</figcaption></figure></p> <h3>Step : 11. Index.php</h3> <p>[php]<br /> After that in wp website index.html file, We should only have A </p> <div id="content"> wrap. Save A file as index.php. Insert A line:get_header, get_sidebar, and get_footer in A same order as wp website layout structure.<br /> [/php]<br /> <figure id="attachment_131" aria-describedby="caption-attachment-131" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/11.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20155'%3E%3C/svg%3E" alt="custom wordpress theme designer" width="300" height="155" class="size-medium wp-image-131" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/11-300x155.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/11-200x103.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/11-300x155.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/11-300x155.gif" alt="custom wordpress theme designer" width="300" height="155" class="size-medium wp-image-131" srcset="https://infinityknow.com/wp-content/uploads/2018/06/11-300x155.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/11-200x103.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-131" class="wp-caption-text">custom wordpress theme designer</figcaption></figure></p> <h3>Step : 12. Understanding A PHP Loop</h3> <p>A image following illustrates how A PHP Loop works. A PHP Loop is used to show blog posts as well as it also lets We control what to show. Basically, A PHP Loop checks if That are posts in wp website blog, while That are posts, show it, if no post found, say <b>“Not Found”</b> for wordpress theme designers.</p> <figure id="attachment_132" aria-describedby="caption-attachment-132" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/12.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20184'%3E%3C/svg%3E" alt="custom wordpress theme designer" width="300" height="184" class="size-medium wp-image-132" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/12-300x184.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/12-200x123.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/12-300x184.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/12-300x184.gif" alt="custom wordpress theme designer" width="300" height="184" class="size-medium wp-image-132" srcset="https://infinityknow.com/wp-content/uploads/2018/06/12-300x184.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/12-200x123.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-132" class="wp-caption-text">custom wordpress theme designer</figcaption></figure> <h3>Step : 13. Data source Copy A PHP Loop</h3> <p>[php]<br /> Go to A default Custom WordPress Theme directory, open A <b>index.php</b> file. Data source Copy A PHP Loop from A default <b>index.php</b> and paste This code it in between A </p> <div id="content">..</div> <p>. Then, interchange A static text toethor A WordPress Template Tags: custom post date, custom title, post category, comments, pagination Like as a next and previous link.<br /> [/php]<br /> <figure id="attachment_133" aria-describedby="caption-attachment-133" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/13.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20132'%3E%3C/svg%3E" alt="wordpress themes for designers" width="300" height="132" class="size-medium wp-image-133" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/13-300x132.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/13-200x88.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/13-300x132.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/13-300x132.gif" alt="wordpress themes for designers" width="300" height="132" class="size-medium wp-image-133" srcset="https://infinityknow.com/wp-content/uploads/2018/06/13-300x132.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/13-200x88.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-133" class="wp-caption-text">wordpress themes for designers</figcaption></figure></p> <h3>Step : 14. Preview A Theme</h3> <p>good Luck! We have done A front page (A main part of A Custom WordPress Theme). After that, login to wp website admin panel, and then to A Design tab, We should see A infinityknowledge (Thems Name) Custom WordPress Theme, activate it and and then to A front page to preview A Custom WordPress Theme.</p> <h3>Step : 15. Single.php</h3> <p>After that, it is time to do A <b>single.php</b> template. If We want, We can and then through A same process — cut source code & paste This code from A default Custom WordPress Theme. But, We find it easier to use A <b>index.php</b> that We absolutely created and save it as <b>single.php</b>. Open A default Custom WordPress Theme <b>single.php</b> file and copy A Template Tags over. Then include A comments_template. A image following highlights what I’ve changed:</p> <figure id="attachment_134" aria-describedby="caption-attachment-134" style="width: 273px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/15.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20273%20300'%3E%3C/svg%3E" alt="wordpress theme designers" width="273" height="300" class="size-medium wp-image-134" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/15-273x300.gif 273w, https://infinityknow.com/wp-content/uploads/2018/06/15-200x220.gif 200w" data-lazy-sizes="(max-width: 273px) 100vw, 273px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/15-273x300.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/15-273x300.gif" alt="wordpress theme designers" width="273" height="300" class="size-medium wp-image-134" srcset="https://infinityknow.com/wp-content/uploads/2018/06/15-273x300.gif 273w, https://infinityknow.com/wp-content/uploads/2018/06/15-200x220.gif 200w" sizes="(max-width: 273px) 100vw, 273px" /></noscript></a><figcaption id="caption-attachment-134" class="wp-caption-text">wordpress theme designers</figcaption></figure> <h3>Step : 16. Page.php</h3> <p>Togethor A main page <b> single.php</b> HTML template We absolutely created, as well as save it as Like name as <b>page.php</b>. Remove A simple comment form, post date, pagination Like as a next/previous link… and That is some it.. so That goes wp website root page Like as a <b>page.php </b> wordpress template.</p> <h3>Step : 17. Remove A HTML Files</h3> <p>Remove all of The A HTML some files in A infinityknowledge (Thems Name) directory (we do not should them anymore). Technically, that is enough such as a a basic WordPress Custom WordPress Theme. You may notice That are more PHP files in A default Custom WordPress Theme. Well, We do not truly should those files if We absolutely want a basic Custom WordPress Theme. For example, if A <b>search.php or 404.php</b> is not present in A Custom WordPress Theme directory, WordPress shall automatically use A index.php to render A page. Read A Template Hierarchy such as a more Information.</p> <h3>Step : 18. WordPress Page Template</h3> <p>Ok, final example. We shall show We how to use Page Template to Make an archive page that shall list all of The posts on wp website blog (good such as a seo ti indexing sitemap). Data source Copy A archives.php file from A default Custom WordPress Theme directory. Remove A unwanted source code as well as We should have something like this:</p> <figure id="attachment_135" aria-describedby="caption-attachment-135" style="width: 293px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/18_0.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20293%20210'%3E%3C/svg%3E" alt="how to create custom theme in wordpress step by step" width="293" height="210" class="size-full wp-image-135" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/18_0.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/18_0.gif" alt="how to create custom theme in wordpress step by step" width="293" height="210" class="size-full wp-image-135" /></noscript></a><figcaption id="caption-attachment-135" class="wp-caption-text">how to create custom theme in wordpress step by step</figcaption></figure> <p>and then We are using A query_post (showposts=-1 stands show all of The posts) to show a list of all of The posts.</p> <figure id="attachment_136" aria-describedby="caption-attachment-136" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/18_1.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20195'%3E%3C/svg%3E" alt="custom wordpress theme designer" width="300" height="195" class="size-medium wp-image-136" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/18_1-300x195.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/18_1-200x130.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/18_1-300x195.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/18_1-300x195.gif" alt="custom wordpress theme designer" width="300" height="195" class="size-medium wp-image-136" srcset="https://infinityknow.com/wp-content/uploads/2018/06/18_1-300x195.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/18_1-200x130.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-136" class="wp-caption-text">custom wordpress theme designer</figcaption></figure> <p>After that, login to wp website admin panel, write a create new page, title it wp Archives. On A HTML Page Template select dropdown, select wp Archives.</p> <figure id="attachment_137" aria-describedby="caption-attachment-137" style="width: 300px" class="wp-caption alignnone"><a href="https://infinityknow.com/wp-content/uploads/2018/06/18_2.gif"><img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20285'%3E%3C/svg%3E" alt="wordpress themes for designers" width="300" height="285" class="size-medium wp-image-137" data-lazy-srcset="https://infinityknow.com/wp-content/uploads/2018/06/18_2-300x285.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/18_2-200x190.gif 200w" data-lazy-sizes="(max-width: 300px) 100vw, 300px" data-lazy-src="https://infinityknow.com/wp-content/uploads/2018/06/18_2-300x285.gif" /><noscript><img src="https://infinityknow.com/wp-content/uploads/2018/06/18_2-300x285.gif" alt="wordpress themes for designers" width="300" height="285" class="size-medium wp-image-137" srcset="https://infinityknow.com/wp-content/uploads/2018/06/18_2-300x285.gif 300w, https://infinityknow.com/wp-content/uploads/2018/06/18_2-200x190.gif 200w" sizes="(max-width: 300px) 100vw, 300px" /></noscript></a><figcaption id="caption-attachment-137" class="wp-caption-text">wordpress themes for designers</figcaption></figure> <p>We hope you get an idea about <b>how to create a wordpress theme from scratch</b><br /> We would like to have feedback on my <a href="https://infinityknow.com/" target="_blank"> Information blog </a>.<br /> Your valuable any feedback, Good question, Inspirational Quotes, or Motivational comments about this article are always welcome.<br /> If you liked this post, Please don’t forget to share this as Well as Like FaceBook Page.</p> <p><b>We hope This Post can help you…….Good Luck!.</b></p> <div class='yarpp yarpp-related yarpp-related-website yarpp-template-list'> <!-- YARPP List --> <h3>Related posts:</h3><ol> <li><a href="https://infinityknow.com/create-custom-helper-class-in-laravel/" rel="bookmark" title="create Custom Helper Class in Laravel">create Custom Helper Class in Laravel </a></li> <li><a href="https://infinityknow.com/custom-ng-template-directive-using-angularjs-examples/" rel="bookmark" title="custom ng-template Directive using AngularJS Examples">custom ng-template Directive using AngularJS Examples </a></li> </ol> </div> <div class='code-block code-block-5' style='margin: 8px 0; clear: both;'> <script type="rocketlazyloadscript" async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-1944225715659599" data-ad-slot="7479448669"></ins> <script type="rocketlazyloadscript"> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div> <!-- AI CONTENT END 1 --> </div><!-- .entry-content --> <footer class="entry-footer"> <div class="entry-tags clearfix"> <span class="meta-tags"> <a href="https://infinityknow.com/tag/create-custom-wordpress-theme-web-design-with-development/" rel="tag">Create Custom Wordpress Theme Web Design with Development</a><a href="https://infinityknow.com/tag/create-responsive-wordpress-theme-from-scratch/" rel="tag">create responsive wordpress theme from scratch</a><a href="https://infinityknow.com/tag/create-wordpress-theme/" rel="tag">create wordpress theme</a><a href="https://infinityknow.com/tag/how-to-create-a-website-with-wordpress-pdf/" rel="tag">how to create a website with wordpress pdf</a><a href="https://infinityknow.com/tag/how-to-create-a-wordpress-theme-from-scratch/" rel="tag">how to create a wordpress theme from scratch</a><a href="https://infinityknow.com/tag/how-to-create-custom-theme-in-wordpress-step-by-step/" rel="tag">how to create custom theme in wordpress step by step</a><a href="https://infinityknow.com/tag/how-to-create-dynamic-content-in-wordpress/" rel="tag">how to create dynamic content in wordpress</a><a href="https://infinityknow.com/tag/how-to-create-dynamic-web-pages-in-wordpress/" rel="tag">how to create dynamic web pages in wordpress</a><a href="https://infinityknow.com/tag/how-to-make-dynamic-page-in-wordpress/" rel="tag">how to make dynamic page in wordpress</a><a href="https://infinityknow.com/tag/wordpress-dynamic-content-from-database/" rel="tag">wordpress dynamic content from database</a><a href="https://infinityknow.com/tag/wordpress-dynamic-page-content/" rel="tag">wordpress dynamic page content</a><a href="https://infinityknow.com/tag/wordpress-page-template/" rel="tag">wordpress page template</a><a href="https://infinityknow.com/tag/wordpress-page-template-plugin/" rel="tag">wordpress page template plugin</a><a href="https://infinityknow.com/tag/wordpress-theme-development/" rel="tag">wordpress theme development</a><a href="https://infinityknow.com/tag/wordpress-theme-development-tutorial-for-beginners/" rel="tag">wordpress theme development tutorial for beginners</a><a href="https://infinityknow.com/tag/wordpress-theme-template/" rel="tag">wordpress theme template</a><a href="https://infinityknow.com/tag/wordpress-without-theme/" rel="tag">wordpress without theme</a> </span> </div><!-- .entry-tags --> <nav class="navigation post-navigation" aria-label="Posts"> <h2 class="screen-reader-text">Post navigation</h2> <div class="nav-links"><div class="nav-previous"><a href="https://infinityknow.com/vuejs-ui-grid-component-sorting-filtering-paging-grouping/" rel="prev"><span class="screen-reader-text">Previous Post:</span>Vuejs UI Grid Component Sorting Filtering Paging Grouping</a></div><div class="nav-next"><a href="https://infinityknow.com/vuejs-dynemically-slider-vuejs-image-slider-component-example-vuejs-carousel-slider-components/" rel="next"><span class="screen-reader-text">Next Post:</span>Vuejs dynemically slider – Vuejs image slider component example – Vuejs Carousel Slider Components</a></div></div> </nav> </footer><!-- .entry-footer --> </article> <div id="comments" class="comments-area"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title"><span>Leave a Reply</span> <small><a rel="nofollow" id="cancel-comment-reply-link" href="/create-custom-dynamic-wordpress-theme-development-tutorial/#respond" style="display:none;">Cancel reply</a></small></h3><form action="https://infinityknow.com/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message" aria-hidden="true">Required fields are marked <span class="required" aria-hidden="true">*</span></span></p><p class="comment-form-comment"><label for="comment">Comment <span class="required" aria-hidden="true">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required" aria-hidden="true">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" required /></p> <p class="comment-form-email"><label for="email">Email <span class="required" aria-hidden="true">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" required /></p> <p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" /></p> <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Save my name, email, and website in this browser for the next time I comment.</label></p> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment" /> <input type='hidden' name='comment_post_ID' value='119' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p></form> </div><!-- #respond --> </div><!-- #comments --> </main><!-- #main --> </section><!-- #primary --> <section id="secondary" class="sidebar widget-area clearfix" role="complementary"> <div class="widget-wrap"><aside id="search-3" class="widget widget_search clearfix"> <form role="search" method="get" class="search-form" action="https://infinityknow.com/"> <label> <span class="screen-reader-text">Search for:</span> <input type="search" class="search-field" placeholder="Search …" value="" name="s" title="Search for:" /> </label> <button type="submit" class="search-submit"> <svg class="icon icon-search" aria-hidden="true" role="img"> <use xlink:href="https://infinityknow.com/wp-content/themes/tortuga/assets/icons/genericons-neue.svg#search"></use> </svg> <span class="screen-reader-text">Search</span> </button> </form> </aside></div><div class="widget_text widget-wrap"><aside id="custom_html-18" class="widget_text widget widget_custom_html clearfix"><div class="textwidget custom-html-widget"><script type="rocketlazyloadscript" async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- responsive --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-1944225715659599" data-ad-slot="1996366350" data-ad-format="auto"></ins> <script type="rocketlazyloadscript"> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div></aside></div><div class="widget-wrap"><aside id="tag_cloud-6" class="widget widget_tag_cloud clearfix"><div class="widget-header"><h3 class="widget-title">Categories</h3></div><div class="tagcloud"><a href="https://infinityknow.com/technology/angularjs/" class="tag-cloud-link tag-link-469 tag-link-position-1" style="font-size: 19.242424242424pt;" aria-label="AngularJs (277 items)">AngularJs<span class="tag-link-count"> (277)</span></a> <a href="https://infinityknow.com/articles/" class="tag-cloud-link tag-link-4 tag-link-position-2" style="font-size: 17.545454545455pt;" aria-label="Articles (158 items)">Articles<span class="tag-link-count"> (158)</span></a> <a href="https://infinityknow.com/technology/asp-net/" class="tag-cloud-link tag-link-3232 tag-link-position-3" style="font-size: 14.010101010101pt;" aria-label="Asp.Net (49 items)">Asp.Net<span class="tag-link-count"> (49)</span></a> <a href="https://infinityknow.com/articles/attorney/" class="tag-cloud-link tag-link-8 tag-link-position-4" style="font-size: 8.3535353535354pt;" aria-label="Attorney (7 items)">Attorney<span class="tag-link-count"> (7)</span></a> <a href="https://infinityknow.com/bio/" class="tag-cloud-link tag-link-6004 tag-link-position-5" style="font-size: 10.121212121212pt;" aria-label="Bio (13 items)">Bio<span class="tag-link-count"> (13)</span></a> <a href="https://infinityknow.com/business/" class="tag-cloud-link tag-link-5974 tag-link-position-6" style="font-size: 10.474747474747pt;" aria-label="Business (15 items)">Business<span class="tag-link-count"> (15)</span></a> <a href="https://infinityknow.com/clothing/" class="tag-cloud-link tag-link-5987 tag-link-position-7" style="font-size: 8.7070707070707pt;" aria-label="Clothing (8 items)">Clothing<span class="tag-link-count"> (8)</span></a> <a href="https://infinityknow.com/articles/cloud/" class="tag-cloud-link tag-link-2933 tag-link-position-8" style="font-size: 9.0606060606061pt;" aria-label="cloud (9 items)">cloud<span class="tag-link-count"> (9)</span></a> <a href="https://infinityknow.com/education/degree/" class="tag-cloud-link tag-link-53 tag-link-position-9" style="font-size: 9.6262626262626pt;" aria-label="Degree (11 items)">Degree<span class="tag-link-count"> (11)</span></a> <a href="https://infinityknow.com/articles/design/" class="tag-cloud-link tag-link-5972 tag-link-position-10" style="font-size: 9.0606060606061pt;" aria-label="Design (9 items)">Design<span class="tag-link-count"> (9)</span></a> <a href="https://infinityknow.com/education/" class="tag-cloud-link tag-link-52 tag-link-position-11" style="font-size: 13.515151515152pt;" aria-label="Education (42 items)">Education<span class="tag-link-count"> (42)</span></a> <a href="https://infinityknow.com/entertainment/" class="tag-cloud-link tag-link-344 tag-link-position-12" style="font-size: 9.0606060606061pt;" aria-label="Entertainment (9 items)">Entertainment<span class="tag-link-count"> (9)</span></a> <a href="https://infinityknow.com/facts/" class="tag-cloud-link tag-link-5995 tag-link-position-13" style="font-size: 11.040404040404pt;" aria-label="Facts (18 items)">Facts<span class="tag-link-count"> (18)</span></a> <a href="https://infinityknow.com/fashion/" class="tag-cloud-link tag-link-5979 tag-link-position-14" style="font-size: 8.7070707070707pt;" aria-label="Fashion (8 items)">Fashion<span class="tag-link-count"> (8)</span></a> <a href="https://infinityknow.com/full-form/" class="tag-cloud-link tag-link-6000 tag-link-position-15" style="font-size: 15.848484848485pt;" aria-label="full form (91 items)">full form<span class="tag-link-count"> (91)</span></a> <a href="https://infinityknow.com/google-adsense/" class="tag-cloud-link tag-link-1284 tag-link-position-16" style="font-size: 11.606060606061pt;" aria-label="Google Adsense (22 items)">Google Adsense<span class="tag-link-count"> (22)</span></a> <a href="https://infinityknow.com/health/" class="tag-cloud-link tag-link-5970 tag-link-position-17" style="font-size: 11.606060606061pt;" aria-label="Health (22 items)">Health<span class="tag-link-count"> (22)</span></a> <a href="https://infinityknow.com/insurance/" class="tag-cloud-link tag-link-10 tag-link-position-18" style="font-size: 8.3535353535354pt;" aria-label="Insurance (7 items)">Insurance<span class="tag-link-count"> (7)</span></a> <a href="https://infinityknow.com/jobs/" class="tag-cloud-link tag-link-347 tag-link-position-19" style="font-size: 8.3535353535354pt;" aria-label="Jobs (7 items)">Jobs<span class="tag-link-count"> (7)</span></a> <a href="https://infinityknow.com/technology/laravel/" class="tag-cloud-link tag-link-656 tag-link-position-20" style="font-size: 17.686868686869pt;" aria-label="Laravel (164 items)">Laravel<span class="tag-link-count"> (164)</span></a> <a href="https://infinityknow.com/lifestyle/" class="tag-cloud-link tag-link-5983 tag-link-position-21" style="font-size: 8.3535353535354pt;" aria-label="Lifestyle (7 items)">Lifestyle<span class="tag-link-count"> (7)</span></a> <a href="https://infinityknow.com/link-building/" class="tag-cloud-link tag-link-6005 tag-link-position-22" style="font-size: 9.0606060606061pt;" aria-label="Link Building (9 items)">Link Building<span class="tag-link-count"> (9)</span></a> <a href="https://infinityknow.com/articles/loans/" class="tag-cloud-link tag-link-6 tag-link-position-23" style="font-size: 8pt;" aria-label="Loans (6 items)">Loans<span class="tag-link-count"> (6)</span></a> <a href="https://infinityknow.com/make-money/" class="tag-cloud-link tag-link-13 tag-link-position-24" style="font-size: 12.666666666667pt;" aria-label="Make Money (31 items)">Make Money<span class="tag-link-count"> (31)</span></a> <a href="https://infinityknow.com/marketing/" class="tag-cloud-link tag-link-5973 tag-link-position-25" style="font-size: 9.3434343434343pt;" aria-label="Marketing (10 items)">Marketing<span class="tag-link-count"> (10)</span></a> <a href="https://infinityknow.com/movies/" class="tag-cloud-link tag-link-5988 tag-link-position-26" style="font-size: 11.888888888889pt;" aria-label="Movies (24 items)">Movies<span class="tag-link-count"> (24)</span></a> <a href="https://infinityknow.com/technology/mysql/" class="tag-cloud-link tag-link-806 tag-link-position-27" style="font-size: 17.969696969697pt;" aria-label="MySQL (180 items)">MySQL<span class="tag-link-count"> (180)</span></a> <a href="https://infinityknow.com/technology/php/" class="tag-cloud-link tag-link-191 tag-link-position-28" style="font-size: 18.959595959596pt;" aria-label="PHP (250 items)">PHP<span class="tag-link-count"> (250)</span></a> <a href="https://infinityknow.com/programming/" class="tag-cloud-link tag-link-4740 tag-link-position-29" style="font-size: 11.040404040404pt;" aria-label="Programming (18 items)">Programming<span class="tag-link-count"> (18)</span></a> <a href="https://infinityknow.com/quotes/" class="tag-cloud-link tag-link-5994 tag-link-position-30" style="font-size: 15.353535353535pt;" aria-label="Quotes (77 items)">Quotes<span class="tag-link-count"> (77)</span></a> <a href="https://infinityknow.com/seo/" class="tag-cloud-link tag-link-210 tag-link-position-31" style="font-size: 9.3434343434343pt;" aria-label="SEO (10 items)">SEO<span class="tag-link-count"> (10)</span></a> <a href="https://infinityknow.com/shayari/" class="tag-cloud-link tag-link-5996 tag-link-position-32" style="font-size: 15pt;" aria-label="Shayari (68 items)">Shayari<span class="tag-link-count"> (68)</span></a> <a href="https://infinityknow.com/sports/" class="tag-cloud-link tag-link-345 tag-link-position-33" style="font-size: 8pt;" aria-label="Sports (6 items)">Sports<span class="tag-link-count"> (6)</span></a> <a href="https://infinityknow.com/status/" class="tag-cloud-link tag-link-5991 tag-link-position-34" style="font-size: 13.020202020202pt;" aria-label="Status (35 items)">Status<span class="tag-link-count"> (35)</span></a> <a href="https://infinityknow.com/stories/" class="tag-cloud-link tag-link-5993 tag-link-position-35" style="font-size: 13.79797979798pt;" aria-label="Stories (46 items)">Stories<span class="tag-link-count"> (46)</span></a> <a href="https://infinityknow.com/suvichar/" class="tag-cloud-link tag-link-5998 tag-link-position-36" style="font-size: 8.7070707070707pt;" aria-label="suvichar (8 items)">suvichar<span class="tag-link-count"> (8)</span></a> <a href="https://infinityknow.com/technology/" class="tag-cloud-link tag-link-190 tag-link-position-37" style="font-size: 22pt;" aria-label="Technology (679 items)">Technology<span class="tag-link-count"> (679)</span></a> <a href="https://infinityknow.com/tips-and-tricks/" class="tag-cloud-link tag-link-4858 tag-link-position-38" style="font-size: 14.292929292929pt;" aria-label="Tips and Tricks (54 items)">Tips and Tricks<span class="tag-link-count"> (54)</span></a> <a href="https://infinityknow.com/articles/top-tranding/" class="tag-cloud-link tag-link-5971 tag-link-position-39" style="font-size: 13.515151515152pt;" aria-label="Top Tranding (42 items)">Top Tranding<span class="tag-link-count"> (42)</span></a> <a href="https://infinityknow.com/articles/trading/" class="tag-cloud-link tag-link-84 tag-link-position-40" style="font-size: 12.737373737374pt;" aria-label="Trading (32 items)">Trading<span class="tag-link-count"> (32)</span></a> <a href="https://infinityknow.com/travel/" class="tag-cloud-link tag-link-5976 tag-link-position-41" style="font-size: 10.333333333333pt;" aria-label="Travel (14 items)">Travel<span class="tag-link-count"> (14)</span></a> <a href="https://infinityknow.com/uncategorized/" class="tag-cloud-link tag-link-1 tag-link-position-42" style="font-size: 9.6262626262626pt;" aria-label="Uncategorized (11 items)">Uncategorized<span class="tag-link-count"> (11)</span></a> <a href="https://infinityknow.com/technology/vuejs/" class="tag-cloud-link tag-link-497 tag-link-position-43" style="font-size: 17.969696969697pt;" aria-label="VueJs (179 items)">VueJs<span class="tag-link-count"> (179)</span></a> <a href="https://infinityknow.com/wishes/" class="tag-cloud-link tag-link-5992 tag-link-position-44" style="font-size: 10.333333333333pt;" aria-label="Wishes (14 items)">Wishes<span class="tag-link-count"> (14)</span></a> <a href="https://infinityknow.com/wordpress/" class="tag-cloud-link tag-link-4742 tag-link-position-45" style="font-size: 10.89898989899pt;" aria-label="wordpress (17 items)">wordpress<span class="tag-link-count"> (17)</span></a></div> </aside></div><div class="widget-wrap"><aside id="block-6" class="widget widget_block clearfix"><a href="https://www.yttags.com/" target="_blank"><img width="604" height="340" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20604%20340'%3E%3C/svg%3E" alt="youtube tag extractor" data-lazy-src="https://infinityknow.com/wp-content/uploads/2022/07/youtube-tag-extractor.jpg"><noscript><img width="604" height="340" src="https://infinityknow.com/wp-content/uploads/2022/07/youtube-tag-extractor.jpg" alt="youtube tag extractor"></noscript></a></aside></div> </section><!-- #secondary --> </div><!-- #content --> <!-- footer --> <div id="footer" class="footer-wrap"> <footer id="colophon" class="site-footer container clearfix" role="contentinfo"> <!-- 1/3 --> <div class="footer-left-stacco column2 pakainfo-footer"> <div id="block-2"><ul> <li><a href="https://www.pakainfo.com/">Home</a></li> <li><a href="https://www.pakainfo.com/about-pakainfo/">About Us</a></li> <li><a href="https://www.pakainfo.com/terms-and-conditions/">Terms And Conditions</a></li> <li><a href="https://www.pakainfo.com/guest-post/">Write For Us</a></li> <li><a href="https://www.pakainfo.com/advertise/">Advertise</a></li> <li><a href="https://www.pakainfo.com/contact-us/">Contact Us</a></li> </ul></div> </div> <!-- /End 1/3 --> <!-- 2/3 --> <div class="footer-center-stacco column4 pakainfo-footer"> <div id="block-3"><ul> <li><a href="https://www.yttags.com/" target="_blank">Youtube Tag Extractor</a></li> <li><a href="https://gpseoagency.com/youtube-channel-monetization-services.html" target="_blank">YouTube Monetization</a></li> <li><a href="https://www.pakainfo.com/guest-post/" target="_blank">Increase Domain Authority</a></li> <li><a href="https://www.pakainfo.com/" target="_blank">Social Media Marketing</a></li> <li><a href="https://www.pakainfo.com/categories/" target="_blank">Freelance web developer</a></li> <li><a href="https://www.pakainfo.com/tools-or-utility/" target="_blank">Tools</a></li> </ul></div> </div> <!-- /End 2/3 --> <!-- 3/3 --> <div class="footer-right-stacco column4 pakainfo-footer"> <div id="block-4"><address><strong>Pakainfo</strong> 9-OLD, Ganesh Sco, Kothariya Ring Road, Chokadi, Rajkot - 360002 India</address><address>E-mail :<strong><a href="mailto:jdk.king25@gmail.com"> jdk.king25@gmail.com</a></strong></address></div> </div> <!-- /End 3/3 --> <!-- 3/3 --> <div class="footer-right-stacco column2 social-link-sec pakainfo-footer"> <div id="block-5"><figure><img width="308" height="74" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20308%2074'%3E%3C/svg%3E" alt="infinityknow" data-lazy-src="https://infinityknow.com/wp-content/uploads/2022/05/Website-logo-footer.png"><noscript><img width="308" height="74" src="https://infinityknow.com/wp-content/uploads/2022/05/Website-logo-footer.png" alt="infinityknow"></noscript></figure> <ul class="social-icon"> <li><a target="_blank" href="https://www.facebook.com/PakaInfo-2032426330320055/" rel="noopener"><span class="normal facebook"></span></a></li> <li><a target="_blank" href="https://twitter.com/pakainfo_com" rel="noopener"><span class="normal twitter"></span></a></li> <li><a target="_blank" href="https://my.linkedin.com/company/pakainfo" rel="noopener"><span class="normal Linked_in"></span></a></li> <li><a target="_blank" href="https://www.youtube.com/channel/UCXLjt-gXfKoKMlyr_cCNhYw" rel="noopener"><span class="normal youtube"></span></a></li> </ul></div> </div> <!-- /End 3/3 --> </footer> <div class="copyright"> <p>© 2022 Pakainfo. All rights reserved.</p> </div> </div> <!-- <div id="footer" class="footer-wrap"> <footer id="colophon" class="site-footer container clearfix" role="contentinfo"> <div id="footer-text" class="site-info"> <span class="credit-link"> WordPress Theme: Tortuga by <a href="https://themezee.com/" target="_blank" rel="nofollow">ThemeZee</a>. </span> </div> </footer> </div> --> </div><!-- #page --> <link data-minify="1" rel='stylesheet' id='yarppRelatedCss-css' href='https://infinityknow.com/wp-content/cache/min/1/wp-content/plugins/yet-another-related-posts-plugin/style/related.css?ver=1664643625' type='text/css' media='all' /> <script type='text/javascript' id='kk-star-ratings-js-extra'> /* <![CDATA[ */ var kk_star_ratings = {"action":"kk-star-ratings","endpoint":"https:\/\/infinityknow.com\/wp-admin\/admin-ajax.php","nonce":"b36146f054"}; /* ]]> */ </script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' src='https://infinityknow.com/wp-content/plugins/kk-star-ratings/src/core/public/js/kk-star-ratings.min.js?ver=5.3.2' id='kk-star-ratings-js' defer></script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' id='rocket-browser-checker-js-after'> "use strict";var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}();function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}var RocketBrowserCompatibilityChecker=function(){function RocketBrowserCompatibilityChecker(options){_classCallCheck(this,RocketBrowserCompatibilityChecker),this.passiveSupported=!1,this._checkPassiveOption(this),this.options=!!this.passiveSupported&&options}return _createClass(RocketBrowserCompatibilityChecker,[{key:"_checkPassiveOption",value:function(self){try{var options={get passive(){return!(self.passiveSupported=!0)}};window.addEventListener("test",null,options),window.removeEventListener("test",null,options)}catch(err){self.passiveSupported=!1}}},{key:"initRequestIdleCallback",value:function(){!1 in window&&(window.requestIdleCallback=function(cb){var start=Date.now();return setTimeout(function(){cb({didTimeout:!1,timeRemaining:function(){return Math.max(0,50-(Date.now()-start))}})},1)}),!1 in window&&(window.cancelIdleCallback=function(id){return clearTimeout(id)})}},{key:"isDataSaverModeOn",value:function(){return"connection"in navigator&&!0===navigator.connection.saveData}},{key:"supportsLinkPrefetch",value:function(){var elem=document.createElement("link");return elem.relList&&elem.relList.supports&&elem.relList.supports("prefetch")&&window.IntersectionObserver&&"isIntersecting"in IntersectionObserverEntry.prototype}},{key:"isSlowConnection",value:function(){return"connection"in navigator&&"effectiveType"in navigator.connection&&("2g"===navigator.connection.effectiveType||"slow-2g"===navigator.connection.effectiveType)}}]),RocketBrowserCompatibilityChecker}(); </script> <script type='text/javascript' id='rocket-preload-links-js-extra'> /* <![CDATA[ */ var RocketPreloadLinksConfig = {"excludeUris":"\/(.+\/)?feed\/?.+\/?|\/(?:.+\/)?embed\/|\/(index\\.php\/)?wp\\-json(\/.*|$)|\/wp-admin\/|\/logout\/|\/wp-login.php","usesTrailingSlash":"1","imageExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif","fileExt":"jpg|jpeg|gif|png|tiff|bmp|webp|avif|php|pdf|html|htm","siteUrl":"https:\/\/infinityknow.com","onHoverDelay":"100","rateThrottle":"3"}; /* ]]> */ </script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' id='rocket-preload-links-js-after'> (function() { "use strict";var r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e=function(){function i(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(e,t,n){return t&&i(e.prototype,t),n&&i(e,n),e}}();function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var t=function(){function n(e,t){i(this,n),this.browser=e,this.config=t,this.options=this.browser.options,this.prefetched=new Set,this.eventTime=null,this.threshold=1111,this.numOnHover=0}return e(n,[{key:"init",value:function(){!this.browser.supportsLinkPrefetch()||this.browser.isDataSaverModeOn()||this.browser.isSlowConnection()||(this.regex={excludeUris:RegExp(this.config.excludeUris,"i"),images:RegExp(".("+this.config.imageExt+")$","i"),fileExt:RegExp(".("+this.config.fileExt+")$","i")},this._initListeners(this))}},{key:"_initListeners",value:function(e){-1<this.config.onHoverDelay&&document.addEventListener("mouseover",e.listener.bind(e),e.listenerOptions),document.addEventListener("mousedown",e.listener.bind(e),e.listenerOptions),document.addEventListener("touchstart",e.listener.bind(e),e.listenerOptions)}},{key:"listener",value:function(e){var t=e.target.closest("a"),n=this._prepareUrl(t);if(null!==n)switch(e.type){case"mousedown":case"touchstart":this._addPrefetchLink(n);break;case"mouseover":this._earlyPrefetch(t,n,"mouseout")}}},{key:"_earlyPrefetch",value:function(t,e,n){var i=this,r=setTimeout(function(){if(r=null,0===i.numOnHover)setTimeout(function(){return i.numOnHover=0},1e3);else if(i.numOnHover>i.config.rateThrottle)return;i.numOnHover++,i._addPrefetchLink(e)},this.config.onHoverDelay);t.addEventListener(n,function e(){t.removeEventListener(n,e,{passive:!0}),null!==r&&(clearTimeout(r),r=null)},{passive:!0})}},{key:"_addPrefetchLink",value:function(i){return this.prefetched.add(i.href),new Promise(function(e,t){var n=document.createElement("link");n.rel="prefetch",n.href=i.href,n.onload=e,n.onerror=t,document.head.appendChild(n)}).catch(function(){})}},{key:"_prepareUrl",value:function(e){if(null===e||"object"!==(void 0===e?"undefined":r(e))||!1 in e||-1===["http:","https:"].indexOf(e.protocol))return null;var t=e.href.substring(0,this.config.siteUrl.length),n=this._getPathname(e.href,t),i={original:e.href,protocol:e.protocol,origin:t,pathname:n,href:t+n};return this._isLinkOk(i)?i:null}},{key:"_getPathname",value:function(e,t){var n=t?e.substring(this.config.siteUrl.length):e;return n.startsWith("/")||(n="/"+n),this._shouldAddTrailingSlash(n)?n+"/":n}},{key:"_shouldAddTrailingSlash",value:function(e){return this.config.usesTrailingSlash&&!e.endsWith("/")&&!this.regex.fileExt.test(e)}},{key:"_isLinkOk",value:function(e){return null!==e&&"object"===(void 0===e?"undefined":r(e))&&(!this.prefetched.has(e.href)&&e.origin===this.config.siteUrl&&-1===e.href.indexOf("?")&&-1===e.href.indexOf("#")&&!this.regex.excludeUris.test(e.href)&&!this.regex.images.test(e.href))}}],[{key:"run",value:function(){"undefined"!=typeof RocketPreloadLinksConfig&&new n(new RocketBrowserCompatibilityChecker({capture:!0,passive:!0}),RocketPreloadLinksConfig).init()}}]),n}();t.run(); }()); </script> <script type='text/javascript' id='tortuga-navigation-js-extra'> /* <![CDATA[ */ var tortugaScreenReaderText = {"expand":"Expand child menu","collapse":"Collapse child menu","icon":"<svg class=\"icon icon-expand\" aria-hidden=\"true\" role=\"img\"> <use xlink:href=\"https:\/\/infinityknow.com\/wp-content\/themes\/tortuga\/assets\/icons\/genericons-neue.svg#expand\"><\/use> <\/svg>"}; /* ]]> */ </script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' src='https://infinityknow.com/wp-content/themes/tortuga/assets/js/navigation.min.js?ver=20220224' id='tortuga-navigation-js' defer></script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' src='https://infinityknow.com/wp-includes/js/comment-reply.min.js?ver=6.0.2' id='comment-reply-js' defer></script> <script type='text/javascript' id='q2w3_fixed_widget-js-extra'> /* <![CDATA[ */ var q2w3_sidebar_options = [{"use_sticky_position":false,"margin_top":12,"margin_bottom":83,"stop_elements_selectors":"","screen_max_width":0,"screen_max_height":0,"widgets":[]}]; /* ]]> */ </script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' src='https://infinityknow.com/wp-content/plugins/q2w3-fixed-widget/js/frontend.min.js?ver=6.1.0' id='q2w3_fixed_widget-js' defer></script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' src='https://infinityknow.com/wp-content/plugins/enlighter/cache/enlighterjs.min.js?ver=uFgLFCvLLLzj31b' id='enlighterjs-js' defer></script> <script type="rocketlazyloadscript" data-rocket-type='text/javascript' id='enlighterjs-js-after'> !function(e,n){if("undefined"!=typeof EnlighterJS){var o={"selectors":{"block":"pre.EnlighterJSRAW","inline":"code.EnlighterJSRAW"},"options":{"indent":2,"ampersandCleanup":true,"linehover":true,"rawcodeDbclick":false,"textOverflow":"break","linenumbers":true,"theme":"classic","language":"generic","retainCssClasses":false,"collapse":false,"toolbarOuter":"","toolbarTop":"{BTN_RAW}{BTN_COPY}{BTN_WINDOW}{BTN_WEBSITE}","toolbarBottom":""}};(e.EnlighterJSINIT=function(){EnlighterJS.init(o.selectors.block,o.selectors.inline,o.options)})()}else{(n&&(n.error||n.log)||function(){})("Error: EnlighterJS resources not loaded yet!")}}(window,console); </script> <script>window.lazyLoadOptions={elements_selector:"img[data-lazy-src],.rocket-lazyload,iframe[data-lazy-src]",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,callback_loaded:function(element){if(element.tagName==="IFRAME"&&element.dataset.rocketLazyload=="fitvidscompatible"){if(element.classList.contains("lazyloaded")){if(typeof window.jQuery!="undefined"){if(jQuery.fn.fitVids){jQuery(element).parent().fitVids()}}}}}};window.addEventListener('LazyLoad::Initialized',function(e){var lazyLoadInstance=e.detail.instance;if(window.MutationObserver){var observer=new MutationObserver(function(mutations){var image_count=0;var iframe_count=0;var rocketlazy_count=0;mutations.forEach(function(mutation){for(i=0;i<mutation.addedNodes.length;i++){if(typeof mutation.addedNodes[i].getElementsByTagName!=='function'){continue} if(typeof mutation.addedNodes[i].getElementsByClassName!=='function'){continue} images=mutation.addedNodes[i].getElementsByTagName('img');is_image=mutation.addedNodes[i].tagName=="IMG";iframes=mutation.addedNodes[i].getElementsByTagName('iframe');is_iframe=mutation.addedNodes[i].tagName=="IFRAME";rocket_lazy=mutation.addedNodes[i].getElementsByClassName('rocket-lazyload');image_count+=images.length;iframe_count+=iframes.length;rocketlazy_count+=rocket_lazy.length;if(is_image){image_count+=1} if(is_iframe){iframe_count+=1}}});if(image_count>0||iframe_count>0||rocketlazy_count>0){lazyLoadInstance.update()}});var b=document.getElementsByTagName("body")[0];var config={childList:!0,subtree:!0};observer.observe(b,config)}},!1)</script><script data-no-minify="1" async src="https://infinityknow.com/wp-content/plugins/wp-rocket/assets/js/lazyload/16.1/lazyload.min.js"></script><script>function lazyLoadThumb(e){var t='<img loading="lazy" data-lazy-src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"><noscript><img src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"></noscript>',a='<div class="play"></div>';return t.replace("ID",e)+a}function lazyLoadYoutubeIframe(){var e=document.createElement("iframe"),t="ID?autoplay=1";t+=0===this.dataset.query.length?'':'&'+this.dataset.query;e.setAttribute("src",t.replace("ID",this.dataset.src)),e.setAttribute("frameborder","0"),e.setAttribute("allowfullscreen","1"),e.setAttribute("allow", "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"),this.parentNode.replaceChild(e,this)}document.addEventListener("DOMContentLoaded",function(){var e,t,a=document.getElementsByClassName("rll-youtube-player");for(t=0;t<a.length;t++)e=document.createElement("div"),e.setAttribute("data-id",a[t].dataset.id),e.setAttribute("data-query", a[t].dataset.query),e.setAttribute("data-src", a[t].dataset.src),e.innerHTML=lazyLoadThumb(a[t].dataset.id),e.onclick=lazyLoadYoutubeIframe,a[t].appendChild(e)});</script> </body> </html> <!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me -->