Saturday, June 3, 2017

How to set frame for all pages

Leave a Comment

I am creating a website in which the site is framed. For better visit here, it has the page of http://cocvidarbha.epizy.com/voting.

Now I want to visit http://cocvidarbha.epizy.com/voting/1.php. But the URL should be seen as http://cocvidarbha.epizy.com/ only.

I have only used frame source in index.php of http://cocvidarbha.epizy.com/

4 Answers

Answers 1

This is more of an client-side answer.

Option 1:

What you can do is tell the browser to change the URL to something else you desire(could also be an non-existing path). Note, you will not be able to change your domain name.

So, in your 1.php file add:

<script>     window.history.pushState("{data: 'pass data'}", "PageTitle", "/url"); </script> 

within in the head tag.

Option: 2

Another way I would recommend is using Ajax.

You could bind all your <a href="/url">, so that when you click it, it returns the data on that url Asynchronously, without reloading the page.

So, in you main index.php file, add:

<li>   <a href="http://cocvidarbha.epizy.com/">Page 1</a> </li> <li>   <a href="http://cocvidarbha.epizy.com/voting/1.php">Page 2</a> </li>  <div id="content">   Content will be loaded here without any page reload or URL change </div> 

And then just before </body>, add:

// Include jQuery <script   src="https://code.jquery.com/jquery-3.2.1.slim.min.js"   integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="   crossorigin="anonymous"></script> <script>  $(document).ready(function(e) {    // Bind click event to all "<a>" tags   $(document).on('click', 'a', function(){     var url = $(this).attr('href');     // Do Ajax Call to "href" clicked     $.ajax({       url: url,       type: "GET",       success: function(data){         $('#content').html(data);       }     })     return false;   });  }); </script> 

Answers 2

Try by using the following example where I have a Link and Iframe in my webpage.

<a id="myLInk" href="ClickMe.html" target="myIFrame"> Click Me </a> 

Here target="myIFrame" will make the link to open in the IFrame with Id "myIFrame".

And this is my Iframe.

<iframe name="myIFrame" src="index.html" align="top" height="500" width="95%" hspace="10" vspace="10" align="middle"> If you can see this, your browser does not support iframes! </iframe> 

Now when you click on the above link with Id "myLInk", then the link source (i.e, ClickMe.html) will be loaded in the iframe. In this way you can load as many links as possible without navigating to the new page. And this will remain the url unchanged.

Answers 3

If you only want the voting php either only or part of your index page, you can always embed it into your index page. If the content is dynamic, this is one solution, as it avoids having to use frames (not supported in HTML5) / 301 redirects/ etc..

You could use php include to embed the file. The embedded file will update on the index page as the php file on the server. As jagb suggested below, it would be advisable to use readfile when including a file; it will return an error message if the file does not exist.

e.g.:

@media (orientation: portrait) {       body, .reorientMessage{          visibility: visible;      }      .mainContent{          visibility: hidden ;      }  }  @media (orientation: landscape) {       .reorientMessage{          visibility: hidden;      }      body,.mainContent{          visibility: visible ;      }  }
<html>  <head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1">  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">  </head>  <body>  <div class="reorientMessage">please reorient etc..</div>  <div class="mainContent"><p>normal stuff here</p>  <br><br></div>  <?php include $_SERVER['DOCUMENT_ROOT'] . '/path/1.php';?>    </body>    </html>

[html above taken from the source output from your index page - 1.php embedded]

The file_get_contents php function will read the contents of the 1.php file and return the contents as a string.

You can embed it similarly using

<?php $1 = file_get_contents('./yourserverpath/1.php'); echo $1; ?> 

where $1 is your variable that holds the contents of the file (and subsequently spits them out! :) )

so your final index page code would look like this:

@media (orientation: portrait) {    body,    .reorientMessage {      visibility: visible;    }    .mainContent {      visibility: hidden;    }  }    @media (orientation: landscape) {    .reorientMessage {      visibility: hidden;    }    body,    .mainContent {      visibility: visible;    }  }
<html>    <head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1">    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">  </head>    <body>    <div class="reorientMessage">please reorient etc..</div>    <div class="mainContent">      <p>normal stuff here</p>      <br><br></div>    <?php  $1 = file_get_contents('http://cocvidarbha.epizy.com/voting/1.php');   //I'm putting in the url cos i don't know your path but use the suggested   //method -  $1 = file_get_contents('./yourserverpath/1.php');  echo $1;  ?>    </body>    </html>

Answers 4

If you need to do the redirection from the default landing page ( index.php ) into required page ( 1.php ), By adding the below lines in your index.php code,

header("location:voting/1.php"); exit; 

If you want to use the frame tag only without any redirection for url show, Change src attribute value into voting/1.php

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment