In the last part of my Drupal 8 theme development tutorial, I highlighted the basic files and folders that are required for getting a theme recognized by the Drupal core. I also took a look at how to include CSS and Javascript libraries to the theme files.
In this part, I will discuss the very important topic of Twig debugging and how to disable the Drupal cache. These steps are essential for the Drupal theme development process because these steps remove the hassle of having to clear the cache every time a change is made to the theme.
Note: These steps are for development environment only. Make sure that you disable the settings made in this tutorial before taking your website or theme live!
Copy page.html.twig
First, navigate to the Drupal website’s folder core/modules/templates. Once there, copy the file named page.html.twig to the theme folder created in the first part of this tutorial series. This file will serve as the default template that Drupal will use.
In this file you will see a section {{page.content}}. This contains all the content that your Drupal website displays by default. Hence, this is where you will add any content you wish to display on your website.
Once you have successfully added the content, you will see that no change takes place upon refreshing the main page of the website. Drupal’s cache is mainly responsible for this issue. To resolve this problem, go to the configuration in the Drupal’s Admin Menu >> Performance and clear the cache. After this, refresh the page again and you will see your intended changes. Remember that this problem will reoccur after making any changes to the website’s content. To workaround this issue, you need to disable the cache in the following steps.
Copy and Rename example.settings.local.php
Now go to the Drupal’s root folder and navigate to the sites folder. In this folder, you will see a file name example.settings.local.php. Copy this file and paste it in the sites/default folder. After that, rename the file to settings.local.php. Remember that you should not alter the original files. This is often the main reason behind mysterious and hard-to-debug errors. Always remember to make a copy of the files and then alter the contents.
Stop Wasting Time on Servers
Cloudways handle server management for you so you can focus on creating great apps and keeping your clients happy.
Changes in the settings.local.php
Once done with the previous step, open the file you renamed and find the commented out line ‘$settings [‘cache’] [‘bins’] [‘render’] = ‘cache.backend.null’;. Uncomment this line, and save the changes.
Changes in the settings.php
Now navigate to the folder sites/default/files. Here, you will find a file named settings.php. Edit this file in your preferred code editor and go to the very bottom of the file. Here you will see two commented out lines:
Uncomment these lines and save the changes.
Remove the Errors
Now go to your website and refresh the page. If you encounter any errors, then just type the following URL in your browser and press Enter: ‘yoursite/core/rebuild.php’ where ‘yoursite’ is the name of your website.
Changes in the development.services.yml
I will now discuss how you can enable Twig debugging. This is a very useful feature in Drupal 8 that allows theme developers to check which markups come from what template files. Enabling the Twig debugging is a fairly simple and straight-forwards task. Here is how you could do it:
Go to the folder sites/default in the Drupal website. Here you will see a file named ‘development.services.yml’. Open this file in a code or text editor. Add the highlighted lines at the end of the file:
Clear the Cache
Now go to your Drupal website and clear the cache. This is the last time you will have to do this.
Take Your Drupal Site to New Heights with Managed Hosting
Elevate your Drupal experience with our expertly managed hosting solutions, designed for exceptional performance and ease.
Conclusion
That’s it! You have successfully disabled Drupal’s cache and enabled Twig Debugging. In doing so you have made the theme development process a lot easier. If you have any inquiries about Drupal hosting or anything else, feel free to drop a comment below – I’m here to assist you. Until we meet again, Adios!
Update: You can check out the next part of this series here.
Shahzeb Ahmed
Shahzeb is a Digital Marketer with a Software Engineering background, works as a Community Manager — PHP Community at Cloudways. He is growth ambitious and aims to learn & share information about PHP & Laravel Development through practice and experimentation. He loves to travel and explore new ideas whenever he finds time. Get in touch with him at [email protected]
