Use page title as text in body - php

Im trying to find a way to display the title of the generated page in the body as text.
I have tried using the following code to display the title.
<script type="text/javascript">
document.write('You have visited the page ' + document.title );
</script>
Although the code does what i want, i think that i must use another way to do it, more SEO friendly! When i open the page and check the code, i see this code and not the result of (document.title).

Add the title to the server-side script that generates this page. You'll need to post some of your server-side code to get a more specific answer. In general:
<?php
$title = "My Page"
echo <<<EOT
<html>
<head>
<title>$title</title>
</head>
<body>
You have visited the page $title
</body>
</html>
EOT
?>

Javascript does not affect the source code of the page. It gets rendered after the page loads and you see the result. Use PHP for sorting like this.

Any client side generated html isn't going to appear in the source. You need to do it server side, in PHP or whatever, if you want it in the source.

Related

Is it possible to pull the content from the title tag and display it as text on a html webpage? Wordpress

I'm in the process of making a site that has a lot of different URL's all sharing the same design. I'm trying to make the titles display on each site because they're all unique, where as everything else is the same for the most part. I tried using this code:
<script type="text/javascript">
<!--
document.write(document.referrer);
// -->
</script>
On some browsers this would display the URL at the bottom of the webpage, but on others it wouldn't show at all, I tried to grab the data from this and move it to where I would like the content to go but I wasn't able to select it at all.
I'm using wordpress as my CMS and I looked into the editor to see if there was something I could do there and realized its all php - something I've never used before. I searched if there was a way to do this in wordpress but turned up with nothing.
I'm assuming this is where the php code should be
<h1 class="site-title">here</h1>
I'm assuming I'd need something similar to the php echo in the href where it says 'here'. Just to try I put the script in the anchor tag and not surprisingly the whole site stopped working because of an error. So I'm stuck.
Is there a way in wordpress that I can pull the title tag from the header into the html?
Here's a simple script to get the title of the page.
var title = $("title").text();
$("body").html("<h1>" + title + "</h1>");
The first line is getting the text portion of the title tag. The second line just replaces all the contents of your body tag to only contain the title extracted. Modify the second line to fit what you need. The important part you need to know is the first line.
I believe this was answered in this question
To get the path, you can use:
var pathname = window.location.pathname; // Returns path only
var url = window.location.href; // Returns full URL
If you want the current page title use
<?php the_title(); ?>
Or if you want the meta title use
<?php wp_title(); ?>
They're both WordPress PHP functions.
Assuming you want the meta title (from the header) use
<h1 class="site-title"><?php wp_title(); ?></h1>
Here's the docs https://developer.wordpress.org/reference/functions/wp_title/
Hope that helps!

Include php file with html via js include

Ok so I am tasked to work with this third party vendor that shows movie times on their end. We have the chance to co-brand our site on their end, so in order to do that we need to create a wrapper of our site so that the movie times can show inside the wrapper so it still looks like your on our site. One option is to have a header and footer included via js external file, that way we can make changes on our side and the updates will show on their side, so we dont have to send them a new header/footer every time we make updates to the wrapper. They suggested we do it this way:
<script src="http://oursite.com/header.php"></script>
<script src="http://oursite.com/footer.php"></script>
So I have raw html in header.php hosted on our side and then I added this in the header before anything else:
<?php header("Content-type: text/javascript"); ?>
However when the page loads I get this error:
SyntaxError: syntax error
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xml
Im assuming there is a problem having raw html code in a js file? If so is there anyway around this?
You should add a link to proper javascript that push desired html to the page.
<script src="http://oursite.com/[somejsfile].js"></script>
You can get help from this answer on how to insert html elements using javascript
If you are going to use javascript to call an external file you need to use ajax. The problem then lies that you are taking about your site and that cannot be done when your domains do not match.
If you do it in the manner you have included you must declare the html in javascript variables then, on load push the data to where it needs to go.
var html = '<html> YOUR CODE WATCH OUT FOR SINGLE QUOTES </html>';
//check for load with jquery
$(document).ready(function(){
$('#header").html(html);
})

Is there a way to overwrite a page's <title> tag by using PHP within the body?

I'm pretty new to PHP and was wondering if there was a way to overwrite what is displayed in a title tag by using PHP inside the body.
Let me explain why I'm trying to do this. I'm using a forum/cms software that allows me to create PHP pages, but won't let me change anything about the header (including the title tag). I was hoping there was a script that I could place into the body using PHP that would overwrite whatever was displayed into the default title tag.
This is probably a crazy question, and if so I apologize.
Just running out of ideas how to get what I need in the title.
Thanks!
You can't.
if you want to change it add some Java Script code that will execute on the client side and do this for you:
<script>
document.title = "This is the new page title.";
</script>
And with some PHP:
<head><title>some title</title></head>
<body>
<?php if (some condition, etc) { ?>
<script>
document.title = "This is the new page title.";
</script>
<?php } ?>
</body>
<html>
<head>
<title>Hello</title>
</head>
<body>
<?
echo "<script>document.title='Hello, World!';</script>";
?>
</body>
</html>

Adding PHP to a static site. Not sure if my workflow is right

Let's try to explain the title of my question to be the more concise I can: I'm basically designing a static HTML website from scratch. Nothing to worry about here.
The point is that I'm trying to include some links that will retrieve some items (a product inventory) from a database (and therefore the site won't be so 'static' anymore), as there're > 300 products and creating an html for each one is not feasible.
After googling and reading several sites for days, the "easiest" solution I came up with is to use PHP and MySQL. Again, nothing to worry about. Just took my time for reading documentation and move along.
My question is more related about the correct workflow for integrating both worlds. Let's see my idea in code:
This is one schematic example of the page where you can browse some products (e.g: product.html):
<html>
<head>
<title>My Site - These are our products</title>
</head>
<body>
<!--Site goes here-->
Search by name
Search by color
<!--rest of site goes here-->
</body>
</html>
Where the links
product_search_by_name.php
product_search_by_color.php
are actually a modified clone of the same page (product.html). This is, keeping same html code, plus the .php code embedded into it, as I want to have the DB results displayed into a div on that same page, keeping exactly same layout.
So, am I doing this right if I want to maintain the appearance of the whole website? I'm absolutely wrong from the base and should start again? Should I give up and work selling frappuchinos on a Star*ucks?
As a sample of the idea I want to achieve is the following: http://www.w3schools.com/tags/default.asp (when you click on the left menu bar, the center zone updates with the content). By the way, are they using AJAX on that website to update just the center zone, or I'm misunderstanding what is AJAX for?
I'm sure I'm missing something but I'm too confused to separate the sheep from the goats, so I'd thank a lot any tips you can give to me (and additional documentation on the internets to read as well).
There are two main ways to merge or migrate from static HTML to dynamic HTML (PHP, PERL, whatever).
(1) One is to have most of the contest as HTML, and the stuff like inventory as dynamic.
<html>
<head>
<title>My Site - These are our products</title>
</head>
<body>
<h1>My Site - These are our products</h1>
<?php
// php code to retrieve links
?>
</body>
</html>
(2) To have a full PHP site.
<?php
echo "<html>" . "\n";
echo "<head>";
echo "My Site - These are our products"
echo "</head>";
echo "<body>" . "\n";
// php code to retrieve links
echo "</body>" . "\n";
echo "</html>" . "\n";
?>
Many developers start by merging both HTML & PHP.
I suggest to learn how to do a very simple but full php site, connect to a database, retrieve some records with a S.Q.L. query, display them as read-only text or links, and later you may change to the other HTML plus PHP way of doing things.
There are several editors and tools to help develop in PHP, specially by looking for a PHP function, or just highlight HTML tags. Scintilla (Linux) or Notepad++ in windowze, its a very simple yet useful tool.
Cheers.
Well, if you want it to make it using Ajax ...
You might want to do the following.
Create the two files as you said, those are not to be included in the HTML file.
Create a JavaScript function to call the files, You can use jQuery api, to link to php. http://api.jquery.com/jQuery.post/ or http://api.jquery.com/jQuery.get/
Link the click of the button inquired to call the JavaScript function, and add html you get from php to the tag you want.
You can create a index.php page and put down your html code in it. It looks like this
<html>
<body>
<!--- links goes here -->
Search Products
</body>
</html>
If you are retrieving products from a database and if you want to create multiple links for the products create a function in your function.php which pulls all the product name from the database. Now add this function into your index.php
index.php
<?php include ('functions.php')?>
<html>
<body>
<h3>Product List</h3>
product name
</body>
</html>
Always embed html in php file. Do not embed php in html file. File should have .php extension.

php getElementById

I have a small problem, I would like a div to be displayed when someone hovers over an image, the problem is that this image is inside php, and there for document.getElementById doesn't work. Is there a way to get round this?
<?php echo "<img onmouseover='xxxxxx' src='img/img.png'>" ?>
what goes in x?
You need to create a javascript function on the webpage where this particular line of code is echoed to the client that will handle the onmouseover event, like this:
<html>
<head>
<script language="javascript" type="text/javascript">
function imageSwap() {
var img = document.getElementById("img1");
//swap out the image...
}
</script>
</head>
<body>
<?php echo "<img id='img1' onmouseover='imageSwap()' src='img/img.png'>" ?>
</body>
</html>
I have a small problem, I would like a div to be displayed when someone hovers over an image
Make sure the information is accessible to people who don't use a pointing device too
the problem is that this image is inside php, and there for document.getElementById doesn't work.
You have misdiagnosed the problem. PHP runs on the server and its output is sent to the client. It cannot prevent something from working (although it can be written badly so it outputs something you don't expect).
If you think PHP is the cause of your problem then you need to stop asking "Why does the JS embedded in this PHP not work?" and start asking "Why is the JS that is outputted from PHP different from the JS I'm trying to write?"
what goes in x?
It is hard to say without seeing the rest of the code.
It depends on why you can't see the div in the first place. Is it invisible? Is it not displayed? Is it not part of the document? Is it covered up by something else? etc. etc.
As a rule of thumb though, you should avoid intrinsic event attributes in favour of assigning event handlers via JavaScript stored in external files. This is part of unobtrusive JavaScript.
You could change the code of Brian Driscoll to make it dynamic like so:
<html>
<head>
<script language="javascript" type="text/javascript">
function imageSwap(el) {
var img = el.id;
//swap out the image...
}
</script>
</head>
<body>
<?php echo "<img id='img1' onmouseover='imageSwap(this)' src='img/img.png'>" ?>
</body>
</html>
This way you will always have the correct id from the image your are hovering on. No matter the amount of images

Categories