Enable Dark Mode!
By: Mohammed Shahil

How to Create Tour in Odoo 13


Tour is a guideline of a module which gives the functional details about the module by giving live scenarios step by step. In this blog, we will discuss the creation of tour in a custom module.

Steps to Creating a tour

For creating a tour we have to specify the details in the javascript file in /static/src/js/tour.js


odoo.define(mobile_service_shop.example_tour', function(require) {
    "use strict";
    // Minimal requirements needed to create a tour
    var core = require('web.core');
    var tour = require('web_tour.tour');
    // Allows you to translate tour steps
    var _t = core._t;
    tour.register('mobile_tour', {
        url: "/web",
        trigger: '.o_app[data-menu-xmlid="mobile_service_shop.mobile_service_main_menu"]',
        content: _t('For managing mobile service? click here.'),
        position: 'bottom',


Options (second argument of tour.register):

Mobile_tour -  technical name of the tour.

url -  page the tour should be starting.

skip_enabled - adds skip button for tips.

wait_for - wait for deferred object before running the script.

test - only for tests.

edition - set enterprise if it is enterprise otherwise odoo will consider as community.


content - is the text that we want to display on the tour.

trigger - will trigger the tour, in this mobile_service_shop is the module name and mobile_service_main_menu is the main menu of the module.

Position - is the position that we want to display the text and icon.

timeout - maximum waiting time to conditions.

width - width that set to the text specified in content, the default will 270.

extra_trigger - is the option to make sure that your step is in the correct screen, for example, ‘trigger’:’.o_form_editable’ can be seen in other screens with this class. But if you write an option ‘extra_trigger’:’.o_mobile_service’ in the step then it will show in the correct screen.

Predefined steps:

SHOW_APPS_MENU_ITEM - build-in function to start from the home screen for blinking icon on the app.

TOGGLE_HOME_MENU - to switch between the app and main screen of odoo.

WEBSITE_NEW_PAGE - it is used in frontend to create a new page on the website.

Trigger in tour:


    trigger:      '.o_app[data-menu-xmlid="mobile_service_shop.mobile_service_main_menu"]',
    content: _t('Want to manage your details? It starts here.'),
    position: 'bottom',


{    trigger: 'input[placeholder="Name"]',
    content: _t('Fill in the name of the record first.'),
    position: 'bottom',


    trigger: '.o-kanban-button-new',
    content: _t('Let\'s create your first record.'),
    position: 'bottom',


    trigger: '.o_form_button_edit',
    content: _t('Let\'s modify our record.'),
    position: 'bottom',


    trigger: '.o_form_button_save',
    content: _t('Click on save to save your new record in the database.'),
    position: 'bottom',


    trigger: '.breadcrumb-item:not(.active):last',
    content: _t('Use the breadcrumbs to go back.'),
    position: 'bottom',

Including javascript file:

   <template id="assets_backend" name="tour_demo assets" inherit_id="web.assets_backend">
       <xpath expr="." position="inside">
           <script type="text/javascript"

Including manifest file:

"depends": [
# ...
"demo": [


You can also start the tour by clicking.


If you need any assistance in odoo, we are online, please chat with us.



So, after i make the module in a staging branch, how can i pass it to the production branch?





Hi! Is this possible co accomplish in odoo.sh?




Leave a comment




Cybrosys Technologies Pvt. Ltd.
Neospace, Kinfra Techno Park
Kakkancherry, Calicut
Kerala, India - 673635



Cybrosys Technologies Pvt. Ltd.
1st Floor, Thapasya Building,
Infopark, Kakkanad,
Kochi, India - 682030.



Cybrosys Techno Solutions
The Estate, 8th Floor,
Dickenson Road,
Bangalore, India - 560042

Send Us A Message