Hey Guys! Welcome back to Techly Series website.

Assuming You are observing the Full Screen Mode Script on blogger. This is the Right Place to you. Since You can get this Script for free.

Today, in this article, I will Discuss with you about How to Add Full Screen Mode Feature in your Website.

What is Full Screen

All significant Web programs support full-screen mode. In this mode, the program utilizes the whole screen to show the Web page, and the page is shown without the standard window borders. Full-screen mode exploits your accessible screen land and gives a valuable stage to introducing visual substance.

How to Add

So, to add Full Screen Mode on blogger you need to follow the following process below precisely.

What's more, with the help of these steps, you can easily add this feature in your blogger website.

Step 1

• You will go to your - Blogger Dashboard
• Go to Theme
• Go to - Edit HTML
• Search - </head> or &lt;/head&gt;
• Copy this CSS Code below and Paste on top of </head> or &lt;/head&gt;

<style>
#openfull,#exitfull{fill:#000;width:22px;height:22px;margin:5px}
#exitfull{display:none}
</style>

Step 2

• After Paste CSS Code
• Search - </body> or &lt;/body&gt;
• Copy this Javascript below and Paste on top of - </body> or &lt;/body&gt;
• Save theme

<script>//<![CDATA[
var elem=document.documentElement;function openFullscreen(){elem.requestFullscreen?elem.requestFullscreen():elem.mozRequestFullScreen?elem.mozRequestFullScreen():elem.webkitRequestFullscreen?elem.webkitRequestFullscreen():elem.msRequestFullscreen&&elem.msRequestFullscreen(),document.getElementById("openfull").style.display="none",document.getElementById("exitfull").style.display="inline-block"}function closeFullscreen(){document.exitFullscreen?document.exitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen?document.webkitExitFullscreen():document.msExitFullscreen&&document.msExitFullscreen(),document.getElementById("openfull").style.display="inline-block",document.getElementById("exitfull").style.display="none"}
//]]></script>

Step 3

• After Save Theme
• Copy this HTML Code and Paste anywhere you like
• Done.

<span id='openfull' onclick='openFullscreen();'>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fullscreen" viewBox="0 0 16 16"><path d="M1.5 1a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0v-4A1.5 1.5 0 0 1 1.5 0h4a.5.5 0 0 1 0 1h-4zM10 .5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 16 1.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5zM.5 10a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 0 14.5v-4a.5.5 0 0 1 .5-.5zm15 0a.5.5 0 0 1 .5.5v4a1.5 1.5 0 0 1-1.5 1.5h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5z"/></svg>
</span>
<span id='exitfull' onclick='closeFullscreen();'>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-fullscreen-exit" viewBox="0 0 16 16"><path d="M5.5 0a.5.5 0 0 1 .5.5v4A1.5 1.5 0 0 1 4.5 6h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5zm5 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 10 4.5v-4a.5.5 0 0 1 .5-.5zM0 10.5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 6 11.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5zm10 1a1.5 1.5 0 0 1 1.5-1.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0v-4z"/></svg>
</span>

Final Words

You ought to indeed note by thinking in the remark box underneath. Or on the other hand you moreover bear to give some sort of Suggestion, likewise you can partake your conviction with me in the Comment Box beneath.

I didn't give this content to any individual who saw or replicated them. This content I've looked through a great deal and given by experience. So kindly don't note on this substance.

Assuming you experience any issues while copying this script you can impart me by Telegram and I'll attempt to help.