Automating WordPress: How AI Can Help You Programmatically Create and Add Menus

In the world of web development, efficiency and automation are key. As a WordPress user, you may have encountered situations where you needed to create and add menus programmatically. Wouldn’t it be amazing if you could leverage the power of artificial intelligence (AI) to generate the necessary code for you? In this blog post, we’ll explore how AI can assist you automating WordPress in creating a menu and adding it to a specific location in your WordPress website. Note that at the time of writing this example, it considers the use in classic themes and not the new Navigation Block in Block Themes but the principle of using AI to automate your WordPress development process is much the same.

Understanding the Challenge of Creating and Adding Menus:

The manual process of creating and adding menus for a classic theme in WordPress involves several steps. First, you need to access the WordPress admin dashboard and navigate to the “Appearance” section. Then, you would select the “Menus” option, which allows you to create a new menu. After naming the menu, you would proceed to add individual menu items manually, such as pages, categories, or custom links. Once the menu items are added, you can arrange them in the desired order. Finally, you would need to assign the menu to a specific location within your WordPress theme, such as the header or sidebar, by selecting the appropriate menu location option.

The manual process of creating and adding menus in WordPress can be prone to various issues. Human error is one such concern, as it’s possible to make mistakes while adding menu items, arranging their order, or assigning them to locations. This can lead to broken links or incorrect menu structures. Additionally, manually creating menus can be time-consuming, especially when dealing with large websites or complex menu hierarchies. Moreover, repetitive tasks are inherent in the process, which can be tedious and monotonous. These issues not only slow down development but also increase the chances of inconsistencies and inefficiencies in menu creation.

    AI and Its Role in Automating WordPress Development:

    AI can perform tasks that typically require human intelligence. It involves the use of algorithms, data, and computational power to enable machines to learn, reason, and make decisions autonomously. The relevance of AI spans across various industries, including: Healthcare, Finance, Retail, Transportation, Education and many more, including web development!
    AI’s relevance in these industries stems from its ability to analyse vast amounts of data, identify patterns, make predictions, automate processes, and deliver insights in a timely manner far quicker than any human could.

    I wanted to test how AI could automating WordPress development workflow and generate code programmatically to register a menu, create a menu, and add items to it. This needed to happen within a plugin, triggered by the “register_activation_hook” event ideally. Just to provide some context, let’s imagine you needed to set up a menu for your plugin with essential pages, similar to an e-commerce plugin that relies on pages such as “shop,” “basket,” and “checkout” to ensure proper functionality. Initially, when I prompted ChatGPT, the AI registered the menus on the “after_setup_theme” event, which didn’t align with my logic. However, I realised that it was my mistake for not specifying clearly enough. Fortunately, it was a simple fix—I elaborated on the prompt by requesting to implement the code during plugin activation rather than using the after_setup_theme event. Here’s how the conversation unfolded:

    a screen shot of a chat with chatGPT

    The first step wasn’t what I wanted but ChatGPT was in mid flows so it would have been rude to interupt… so lets see how it was going…

    a screen shot of a chat with chatGPT

    The next step was what I was really after, I often tend to forget the specific function for adding menu items to a menu. Typically, I would have resorted to Googling and then sifting through the search results until I found the relevant documentation in the WordPress developer docs. With the AI-generated code, clearly this saved me time searching and navigating through the WordPress documentation.

    a screen shot of a chat with chatGPT

    Almost ready to test, I just needed to wrap it in the correct hook

    register_activation_hook()
    a screen shot of a chat with chatGPT

    Upon further examination, I observed that wp_update_nav_menu_item() was inserting the home page, which was not the desired outcome. In my configuration, I had multiple pages with titles, slugs, and template references located in a partials folder. Consequently, I wanted to use this function within a foreach loop to iterate through these pages. Anticipating this requirement, I asked the AI to modify the code and use the page ID instead. Since I had implemented logic to create pages during plugin activation, I knew I would have access to the page IDs. Therefore, I prompted the AI to make the necessary adjustments to utilise the page ID.

    a screen shot of a chat with chatGPT

    Testing and Fine-Tuning the AI-Generated Code:

    With all the necessary code in hand, I proceeded to test it upon plugin activation. However, it’s crucial to emphasise the importance of conducting thorough testing in a local development environment. Never blindly trust that the code will work flawlessly when deployed anywhere. Additionally, the generated code didn’t align perfectly with my specific logic, but it provided the foundational elements for adaptation and integration with my existing code.

    After merging and testing the generated code for functionality and responsiveness, it became evident that something was amiss. Through debugging and examining the database, I discovered that the theme mod was being set using the term ID instead of the expected slug. Here is the incorrect code snippet:

    a screen shot of a chat with chatGPT

    The AI mistakenly used the ‘name’ parameter instead of the correct ‘slug’ parameter in the get_term_by function. Consequently, the set_theme_mod wasn’t being set correctly. Thankfully, after highlighting this issue to the AI, it graciously rectified the code. This time, it wasn’t due to a vague prompt but an actual error in the generated code.

    Automating WordPress a screen shot of a chat with chatGPT

    Conclusion:

    Undoubtedly, there are benefits to using AI for code generation, and it certainly saved me a significant amount of time. However, it’s important to acknowledge that it’s not flawless. As a developer, knowing how to debug code is crucial, as relying solely on AI-generated code could lead to confusion for users and hinder deployment. It seems unlikely that developers will be replaced entirely by AI just yet.

    Nevertheless, I encourage developers to explore AI-powered tools as part of their workflow. While AI can assist and streamline automating WordPress development, it should be used alongside your coding and debugging skills in your local development environment.

    The power of AI is constantly evolving, and who knows what advancements we’ll see in the future. It’s important to leverage technology as a helpful tool, but with caution. Personally, I believe that building complex plugins solely with AI may still be challenging due to the variability of build tools and includes. However, using AI for referencing small code segments can be a significant advantage, similar to breaking down functions and methods into modular code. AI can be an excellent partner for pair coding sessions. 🙌


    Leave a Reply

    Your email address will not be published. Required fields are marked *