开发者

How to create a dynamic page title using PHP

Hi I was wondering if anyone can help with this PHP problem.

Is it possible to use the text in a H2 tag and use that to populate the page title dynamically.

I'd also like to be able to use this same technique to add the H2 text into the me开发者_JS百科ta description - Can anyone help?


If your h2 text is dynamically made then other parts of your web page can be dynamically created too. For example, if you have a variable $a = "My Text"

<?php
$a = "My Text"
?>
<html>
<head>
<title><?php echo $a;?></title>
</head>
<body>
<h2><?php echo $a;?></h2>
</body>
</html>

Using this technique, you can define the text of other parts of the web page.


That sounds like something that jQuery would excel at:

<script type='text/javascript' src='jquery-1.4-min.js'></script>
<script type="text/javascript">
    $(document).ready(function() {
        document.title = $('h2:first').text();
    });
</script>

To modify the meta data, you would do more of the same. I strongly recommend jQuery - Novice to Ninja as an amazing way to get into great depth with jQuery.

<html>
<head>
<meta description="" />
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('meta:first').attr('description', $('h2:first').text());
        alert($('meta:first').attr('description'));
    });
</script>
</head>
<body>
<h2>Testing 123</h2>
</body>
</html>


For anyone looking for a slightly more dynamic method which does the meta and the title at the same time and uses some fall backs:

<script type="text/javascript">
$(document).ready(function() {
    $title = '';
    if($('h1:first').text() != '')
    {
        $title = $('h1:first').text();
        document.title = document.title + " | " + $title;
        $('meta:first').attr('content', $title);
    } else if($('h2:first').text() != ''){
        $title = $('h2:first').text();
        document.title = document.title + " | " + $title;
        $('meta:first').attr('content', $title);
    } else if($('h3:first').text() != ''){
        $title = $('h3:first').text();
        document.title = document.title + " | " + $title;
        $('meta:first').attr('content', $title);
    } else if($('.panel-heading:first').text() != ''){
        $title = $('.panel-heading:first').text();
        document.title = document.title + " | " + $title;
        $('meta:first').attr('content', $title);
    }
});
</script>

This will concatenate the generated title onto the end of your current title. It also sets the description to the same value.

You must have the description meta tag as the first meta tag in your header for this to work for setting the description meta. If this is not the case you can change the $('meta:first') selector to select the description meta tag.

I use bootstrap so the first panel-heading is my fall back case: $('.panel-heading:first'), change this to represent a appropriate desired fall back if there are not header tags on the current page.

When all else fails, this script will leave your title's value at its present value.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜