{"id":4671,"date":"2017-10-24T04:10:48","date_gmt":"2017-10-24T04:10:48","guid":{"rendered":"http:\/\/a1webdesignteam.com\/blog\/?p=4671"},"modified":"2017-10-24T04:10:48","modified_gmt":"2017-10-24T04:10:48","slug":"customize-template-in-joomla","status":"publish","type":"post","link":"https:\/\/a1webdesignteam.com\/blog\/customize-template-in-joomla\/","title":{"rendered":"Customize Template in Joomla"},"content":{"rendered":"<p>Following are the simple steps to customize the template in Joomla.<\/p>\n<p><b>Step (1)<\/b>\u00a0\u2212 Click\u00a0<b>Extensions<\/b>\u00a0\u2192\u00a0<b>Template Manager<\/b>\u00a0as shown below.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step1.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (2)<\/b>\u00a0\u2212 After clicking on\u00a0<b>Template Manager<\/b>, the\u00a0<b>Template Manager: Styles<\/b>\u00a0page will get displayed.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step2.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (3)<\/b>\u00a0\u2212 Next, click on\u00a0<b>Templates<\/b>\u00a0as shown above, you will get the following screen. Here select any one of the Templates.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step3.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (4)<\/b>\u00a0\u2212 After selecting a template you will get the screen as shown below. In the\u00a0<b>Editor<\/b>\u00a0tab, template files are listed on the left side of the page as seen below.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step4.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (5)<\/b>\u00a0\u2212 Select any of the files by clicking on it for editing.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step5.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (6)<\/b>\u00a0\u2212 Click on\u00a0<b>Create Overrides<\/b>\u00a0tab, you will see the list of\u00a0<b>Modules<\/b>,\u00a0<b>Components<\/b>, and\u00a0<b>Layouts<\/b>\u00a0present in the template manager as shown below. Here you can easily override the new templates.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step6.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (7)<\/b>\u00a0\u2212 Click on any one component and you will see many sub-components present inside it as shown below.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step7.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (8)<\/b>\u00a0\u2212 When you click on any one sub-component then you will get the following message.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step8.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (9)<\/b>\u00a0\u2212 You can see the overrides file is available for editing or not by going back to the\u00a0<b>Editor<\/b>\u00a0tab as shown below.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step9.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<p><b>Step (10)<\/b>\u00a0\u2212 After clicking on\u00a0<b>Template Description<\/b>\u00a0tab, you will see the detail description of the selected template as shown below.<\/p>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-step10.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<h2>Toolbar<\/h2>\n<p>Below we have mentioned details about the fields on toolbar in the Template Manager.<\/p>\n<ul class=\"list\">\n<li><b>Save<\/b>\u00a0\u2212 Saves your template manager.<\/li>\n<li><b>Save &amp; Close<\/b>\u00a0\u2212 Saves the templates and closes the current screen.<\/li>\n<li><b>Copy Template<\/b>\u00a0\u2212 Enter the template name and click on\u00a0<b>Copy Template<\/b>\u00a0button which will help you to copy the template.<\/li>\n<\/ul>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-copytemplate.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<ul class=\"list\">\n<li><b>Manage Folders<\/b>\u00a0\u2212 It creates a new folder inside the template. Write the folder name in the field and click on\u00a0<b>Create<\/b>\u00a0button.<\/li>\n<\/ul>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-managefolder.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<ul class=\"list\">\n<li><b>New File<\/b>\u00a0\u2212 You can select the file type by clicking on the dropdown of\u00a0<b>File Type<\/b>\u00a0and write the name of the file and click on\u00a0<b>Create<\/b>\u00a0button which will create a new file. The second block is used to upload a file directly from your system and the last block is used to copy the file.<\/li>\n<\/ul>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-newfile.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<ul class=\"list\">\n<li><b>Rename File<\/b>\u00a0\u2212 Enter the new name for the file and click on\u00a0<b>Rename<\/b>button.<\/li>\n<\/ul>\n<p><img src=\"https:\/\/www.tutorialspoint.com\/joomla\/images\/joomla-customizetemplate\/joomla-customizetemplate-renamefile.jpg\" alt=\"joomla Customize Template\" \/><\/p>\n<ul class=\"list\">\n<li><b>Delete File<\/b>\u00a0\u2212 Deletes the particular file.<\/li>\n<li><b>Close File<\/b>\u00a0\u2212 Closes the current file.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Following are the simple steps to customize the template in Joomla. Step (1)\u00a0\u2212 Click\u00a0Extensions\u00a0\u2192\u00a0Template Manager\u00a0as shown below. Step (2)\u00a0\u2212 After clicking on\u00a0Template Manager, the\u00a0Template Manager: Styles\u00a0page will get displayed. Step (3)\u00a0\u2212 Next, click on\u00a0Templates\u00a0as shown above, you will get the following screen. Here select any one of the Templates. Step (4)\u00a0\u2212 After selecting a template [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":4672,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0},"categories":[26],"tags":[51],"_links":{"self":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts\/4671"}],"collection":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/comments?post=4671"}],"version-history":[{"count":0,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/posts\/4671\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/media\/4672"}],"wp:attachment":[{"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/media?parent=4671"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/categories?post=4671"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/a1webdesignteam.com\/blog\/wp-json\/wp\/v2\/tags?post=4671"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}