{"id":3521,"date":"2017-09-09T07:10:28","date_gmt":"2017-09-09T07:10:28","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&p=3521"},"modified":"2020-05-07T07:40:28","modified_gmt":"2020-05-07T07:40:28","slug":"logo","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/logo\/","title":{"rendered":"Logo"},"content":{"rendered":"\n

This article is for AMP Theme Framework<\/a> users.
<\/p>\n\n\n\n

About this Component<\/h3>\n\n\n\n

Logo Component is responsible for setting the Logo on your AMP theme header.<\/p>\n\n\n\n

How to use:<\/h3>\n\n\n\n

Following are the steps to use this component.<\/p>\n\n\n\n

Step 1:<\/strong><\/p>\n\n\n\n

To initiate the support for the component in your theme just add the following code to the functions.php of the theme files.<\/p>\n\n\n\n

\/\/Logo\nadd_amp_theme_support('AMP-logo');<\/pre><\/div>\n\n\n\n
This was the back-end part where we’ve just initiated, now to make it appear in the front-end follow the next step.<\/p>\n\n\n\n
Step 2:<\/strong><\/p>\n\n\n\n
To add the Logo<\/strong> we need to call it where we wanted to set it.
example: add the following code in header.php of the theme files.<\/p>\n\n\n\n
 <?php amp_logo(); ?><\/pre><\/div>\n\n\n\n
with this, you’re successfully able to set Logo<\/strong> on your theme and if you want to change the width and height of the logo then you need to follow these steps.<\/p>\n\n\n\n
You will find this option to WordPress Dashboard<\/strong> -> AMP option panel<\/strong> -> Settings<\/strong> -> General<\/strong> -> Enable “Resize<\/strong>” option and enter the width and height and click on the “Save change<\/strong>” button.<\/p>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n
That\u2019s it for this tutorial!<\/strong><\/p>\n\n\n\n
We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n
\n\t\t\tAsk your Questions Directly!<\/strong>
\n\t\t\t
If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t