Google Ads

Auto Redirect HTTPS to full site – PHP Code

 

  • Find out header,php file from your script
  • and copy following codes
  • Past codes to very top in header,php

 

 
 
  1. <?php
  2. if (!(isset($_SERVER['HTTPS']) && ($_SERVER['HTTPS'] == 'on' ||
  3. $_SERVER['HTTPS'] == 1) ||
  4. isset($_SERVER['HTTP_X_FORWARDED_PROTO']) &&
  5. $_SERVER['HTTP_X_FORWARDED_PROTO'] == 'https'))
  6. {
  7. $redirect = 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
  8. header('HTTP/1.1 301 Moved Permanently');
  9. header('Location: ' . $redirect);
  10. exit();
  11. }
  12. ?>

 

Try Your Self ->

 


Redirecting from HTTP to HTTPS with PHP on IIS – PHP Code

 

 
 
  1. <?php
  2. if (! isset($_SERVER['HTTPS']) or $_SERVER['HTTPS'] == 'off' ) {
  3. $redirect_url = "https://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
  4. header("Location: $redirect_url");
  5. exit();
  6. }
  7. ?>

 

Try Your Self ->

 


Auto Redirecting from HTTP to HTTPS with PHP – PHP Cod

Open your index.php file and copy following codes and post in index.php on very top.

 

 
 
  1. <?php
  2. if (!(isset($_SERVER['HTTPS']) && ($_SERVER['HTTPS'] == 'on' ||
  3. $_SERVER['HTTPS'] == 1) ||
  4. isset($_SERVER['HTTP_X_FORWARDED_PROTO']) &&
  5. $_SERVER['HTTP_X_FORWARDED_PROTO'] == 'https'))
  6. {
  7. $redirect = 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
  8. header('HTTP/1.1 301 Moved Permanently');
  9. header('Location: ' . $redirect);
  10. exit();
  11. }
  12. ?>

 

Try Your Self ->

 


Inline frame (a frame inside an HTML page) HTML IFrame HTML Examples – HTML Code

 

 
 
  1. <iframe src="demo_iframe.htm"></iframe>

 

Try Your Self ->

 


Layout using flexbox 3 HTML Layout HTML Examples – HTML Code

 

 
 
  1. <style>
  2. .flex-container {
  3. display: -webkit-flex;
  4. display: flex;
  5. -webkit-flex-flow: row wrap;
  6. flex-flow: row wrap;
  7. font-weight: bold;
  8. text-align: center;
  9. }
  10. .flex-container > * {
  11. padding: 10px;
  12. flex: 1 100%;
  13. }
  14. .main {
  15. text-align: left;
  16. background: cornflowerblue;
  17. }
  18. .header {background: coral;}
  19. .footer {background: lightgreen;}
  20. .aside1 {background: moccasin;}
  21. .aside2 {background: violet;}
  22. @media all and (min-width: 768px) {
  23. .aside { flex: 1 auto; }
  24. .main { flex: 3 0px; }
  25. .aside1 { order: 1; }
  26. .main { order: 2; }
  27. .aside2 { order: 3; }
  28. .footer { order: 4; }
  29. }
  30. </style>

 

 
 
  1. <div class="flex-container">
  2. <header class="header">Header</header>
  3. <aside class="aside aside1">Aside 1</aside>
  4. <article class="main">
  5. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sed ex turpis. Cras luctus nibh lectus, in ullamcorper ex tempor eleifend. Nulla bibendum, eros a consequat vestibulum, orci massa fermentum quam, sed commodo nunc ex vitae nisl. Aliquam ullamcorper interdum est nec tincidunt.</p>
  6. </article>
  7. <aside class="aside aside2">Aside 2</aside>
  8. <footer class="footer">Footer</footer>
  9. </div>

 

Try Your Self ->

 


Layout using flexbox 2 HTML Layout HTML Examples – HTML Code

 

 
 
  1. <style>
  2. .flex-container {
  3. display: -webkit-flex;
  4. display: flex;
  5. -webkit-flex-flow: row wrap;
  6. flex-flow: row wrap;
  7. font-weight: bold;
  8. text-align: center;
  9. }
  10. .flex-container > * {
  11. padding: 10px;
  12. flex: 1 100%;
  13. }
  14. .main {
  15. text-align: left;
  16. background: cornflowerblue;
  17. }
  18. .header {background: coral;}
  19. .footer {background: lightgreen;}
  20. .aside {background: moccasin;}
  21. @media all and (min-width: 768px) {
  22. .aside { flex: 1 auto; }
  23. .main { flex: 3 0px; }
  24. .aside { order: 1; }
  25. .main { order: 2; }
  26. .footer { order: 4; }
  27. }
  28. </style>

 

 
 
  1. <div class="flex-container">
  2. <header class="header">Header</header>
  3. <aside class="aside">Aside</aside>
  4. <article class="main">
  5. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sed ex turpis. Cras luctus nibh lectus, in ullamcorper ex tempor eleifend. Nulla bibendum, eros a consequat vestibulum, orci massa fermentum quam, sed commodo nunc ex vitae nisl. Aliquam ullamcorper interdum est nec tincidunt.</p>
  6. </article>
  7. <footer class="footer">Footer</footer>
  8. </div>

 

Try Your Self ->

 


Layout using flexbox HTML Layout HTML Examples – HTML Code

 

 
 
  1. <style>
  2. * {
  3. box-sizing: border-box;
  4. }
  5. body {
  6. font-family: Arial, Helvetica, sans-serif;
  7. }
  8. /* Style the header */
  9. header {
  10. background-color: #666;
  11. padding: 30px;
  12. text-align: center;
  13. font-size: 35px;
  14. color: white;
  15. }
  16. /* Container for flexboxes */
  17. section {
  18. display: -webkit-flex;
  19. display: flex;
  20. }
  21. /* Style the navigation menu */
  22. nav {
  23. -webkit-flex: 1;
  24. -ms-flex: 1;
  25. flex: 1;
  26. background: #ccc;
  27. padding: 20px;
  28. }
  29. /* Style the list inside the menu */
  30. nav ul {
  31. list-style-type: none;
  32. padding: 0;
  33. }
  34. /* Style the content */
  35. article {
  36. -webkit-flex: 3;
  37. -ms-flex: 3;
  38. flex: 3;
  39. background-color: #f1f1f1;
  40. padding: 10px;
  41. }
  42. /* Style the footer */
  43. footer {
  44. background-color: #777;
  45. padding: 10px;
  46. text-align: center;
  47. color: white;
  48. }
  49. /* Responsive layout - makes the menu and the content (inside the section) sit on top of each other instead of next to each other */
  50. @media (max-width: 600px) {
  51. section {
  52. -webkit-flex-direction: column;
  53. flex-direction: column;
  54. }
  55. }
  56. </style>

 

 
 
  1. <header>
  2. <h2>Cities</h2>
  3. </header>
  4. <section>
  5. <nav>
  6. <ul>
  7. <li><a href="#">London</a></li>
  8. <li><a href="#">Paris</a></li>
  9. <li><a href="#">Tokyo</a></li>
  10. </ul>
  11. </nav>
  12. <article>
  13. <h1>London</h1>
  14. <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
  15. <p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
  16. </article>
  17. </section>
  18. <footer>
  19. <p>Footer</p>
  20. </footer>

 

Try Your Self ->

 


Layout using float HTML Layout HTML Examples – HTML Code

 

 
 
  1. <style>
  2. * {
  3. box-sizing: border-box;
  4. }
  5. body {
  6. font-family: Arial, Helvetica, sans-serif;
  7. }
  8. /* Style the header */
  9. header {
  10. background-color: #666;
  11. padding: 30px;
  12. text-align: center;
  13. font-size: 35px;
  14. color: white;
  15. }
  16. /* Create two columns/boxes that floats next to each other */
  17. nav {
  18. float: left;
  19. width: 30%;
  20. height: 300px; /* only for demonstration, should be removed */
  21. background: #ccc;
  22. padding: 20px;
  23. }
  24. /* Style the list inside the menu */
  25. nav ul {
  26. list-style-type: none;
  27. padding: 0;
  28. }
  29. article {
  30. float: left;
  31. padding: 20px;
  32. width: 70%;
  33. background-color: #f1f1f1;
  34. height: 300px; /* only for demonstration, should be removed */
  35. }
  36. /* Clear floats after the columns */
  37. section:after {
  38. content: "";
  39. display: table;
  40. clear: both;
  41. }
  42. /* Style the footer */
  43. footer {
  44. background-color: #777;
  45. padding: 10px;
  46. text-align: center;
  47. color: white;
  48. }
  49. /* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
  50. @media (max-width: 600px) {
  51. nav, article {
  52. width: 100%;
  53. height: auto;
  54. }
  55. }
  56. </style>

 

 
 
  1. <header>
  2. <h2>Cities</h2>
  3. </header>
  4. <section>
  5. <nav>
  6. <ul>
  7. <li><a href="#">London</a></li>
  8. <li><a href="#">Paris</a></li>
  9. <li><a href="#">Tokyo</a></li>
  10. </ul>
  11. </nav>
  12. <article>
  13. <h1>London</h1>
  14. <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
  15. <p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
  16. </article>
  17. </section>
  18. <footer>
  19. <p>Footer</p>
  20. </footer>

 

Try Your Self ->

 


Access an element with a specific id, with JavaScript HTML Id HTML Examples – HTML Code

 

 
 
  1. <h1 id="myHeader">Hello World!</h1>
  2. <button onclick="displayResult()">Change text</button>

 

 
 
  1. <script>
  2. function displayResult() {
  3. document.getElementById("myHeader").innerHTML = "Have a nice day!";
  4. }
  5. </script>

 

Try Your Self ->

 


Difference between class and id HTML Id HTML Examples – HTML Code

 

 
 
  1. <style>
  2. /* Style the element with the id "myHeader" */
  3. #myHeader {
  4. background-color: lightblue;
  5. color: black;
  6. padding: 40px;
  7. text-align: center;
  8. }
  9. /* Style all elements with the class name "city" */
  10. .city {
  11. background-color: tomato;
  12. color: white;
  13. padding: 10px;
  14. }
  15. </style>

 

 
 
  1. <!-- A unique element -->
  2. <h1 id="myHeader">My Cities</h1>
  3. <!-- Multiple similar elements -->
  4. <h2 class="city">London</h2>
  5. <p>London is the capital of England.</p>
  6. <h2 class="city">Paris</h2>
  7. <p>Paris is the capital of France.</p>
  8. <h2 class="city">Tokyo</h2>
  9. <p>Tokyo is the capital of Japan.</p>

 

Try Your Self ->

 

"