Adding Meta Data
Want to add Meta Data to your pages so they can be processed by SEO bots? The best way for your page to be shareable, and searchable by SEO bots or Social Networking sites is by adding Meta Data to your pages. For example if you are creating a Products page, you want the information about a product to be easily read by SEO bots or Social Networking sites. If the following is not set on a page, the UserCandy Framework will default to the data set in the AdminPanel -> Main Settings.
In this example we are going to expand the
/custom/pages/Demo.php page that we created in
Creating First Page documentation.
Page Title
To set the page title use code similar to the following:
Code
$meta['title'] = "Demo Page Title";
To set the page description use code similar to the following:
Code
$meta['description'] = "This is the Demo Page Description";
To set the page keywords use code similar to the following:
Code
$meta['keywords'] = "Demo, Page, Test, UserCandy";
The page image is loaded by Social Networks when sharing the link to the page. To set the page image use code similar to the following:
Code
$meta['image'] = "https://www.usercandy.com/UserCandyLogo.png";
Your
/custom/pages/Demo.php file should look similar to this:
Code
<?php
$meta['title'] = "Demo Page Title";
$meta['description'] = "This is the Demo Page Description";
$meta['keywords'] = "Demo, Page, Test, UserCandy";
$meta['image'] = "https://www.usercandy.com/UserCandyLogo.png";
echo "Hello World";
?>
Save the Demo.php file with the settings above. Now if you refresh your page, it will now reflect the changes to the meta data just yet. UserCandy Framework is designed to store the Meta Data in the Database automatically. The router will then pull the Meta Data for each page on load. We have it setup this way so that you don't have to put a bunch of extra code in each file you create. So if you refresh the Demo page again, you should now see that the title of the page changed in the browser tab at the top. If you right click in the browser and select
View Source you should see data similar to the following near the top:
Code
<title>My UserCandy Web Site - Demo Page Title</title>
<meta name="keywords" content="Demo, Page, Test, UserCandy">
<meta name="description" content="This is the Demo Page Description">
<link rel="canonical" href="https://demo.usercandy.com/" />
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Demo Page Title" />
<meta property="og:description" content="This is the Demo Page Description" />
<meta property="og:url" content="https://demo.usercandy.com/" />
<meta property="og:site_name" content="My UserCandy Web Site" />
<meta property="og:image" content="https://www.usercandy.com/UserCandyLogo.png"/>
<meta name="twitter:card" content="summary" />
<meta name="twitter:description" content="This is the Demo Page Description" />
<meta name="twitter:title" content="Demo Page Title" />
If you change the Meta Data in the future on a page, the UserCandy Framework will see that change and update it in the database. If you get suck or have any suggestions for Meta Data usage, please use the Forums.
