Menu Close
    Searching for an experienced Shopify Development Company ?

    Product FAQ for Shopify: Workflow

    Presentation of Product FAQ for Shopify Workflow

    Let’s see how the Admin can navigate through this application.

    Workflow from Admin’s End

    Admin needs to login to his Shopify Store

    Now, the Admin can install the Product FAQ app by

    Visiting the Landing Page

    Click on ‘Try Product FAQ Now’, enter your store’s URL & hit the install button!

    product faq

    Further, approve the app charges & you’ll be all set to use this app!

    Admin can find this app installed in the ‘Apps‘ section of his Shopify Backend

    webkul product faq

    Clicking on the app will redirect you to this page

    product faq

    Now the Admin needs to configure the app for making it look good on the frontend & for this, click on the configuration button as shown in the image above.

    Configuration

    Admin can configure the theme color as well as the font

    product faq

    After configuration, the Admin needs to add the Domain name of his store to the app & for this, click on the domain name button as shown previously.

    Domain Name

    product faq webkul

    Now, the Admin will be adding General FAQ for his store

    Click on the ‘General FAQ’ button as shown in the image above ↑

    Here, click on the ‘+ Add New General FAQ’ button

    webkul product faq

    Now, the Admin will add FAQ sequence, title & description.

    prouct faq by webkul

    The added General FAQ will be listed on the page as shown in the image below

    webkul product faq

    If the Admin wishes to edit/delete/enable/disable the added general FAQ then he can do so for this page.

    The Admin now needs to display these added General FAQ on the frontend & for this, he will have to add a navigation menu to his store’s header.

    Admin can add a navigation menu to his Shopify Store header by

    going to Shopify Backend >> Online Store >> Navigation >> Main Menu

    webkul product faq

    Click on Add New Menu

    product faq

    Enter the name for the menu & for the link select Pages from the drop-drop menu & then click on Store FAQs.

    Save the Configuration!

    product faq by Webkul

    This is how the added General FAQ will be added to the storefront

    faq

    This is all he needs to do regarding the general faq.

    Now the Admin needs to add a FAQ to a product

    For this, Admin will go to Shopify backend >> Products >> All Products

    Click on a particular product to navigate to its edit page

    product faq by webkul

    Now click on ‘More Action‘ drop-down menu & then click on the Product FAQ button

    product faq by webkul

    Once, you click on this button, you will be redirected to the Product FAQ app

    webkul blog

     Click on the + Add New FAQ button

    Enter the required details & save

    webkul blog

    The added product FAQ will be viewed by clicking on the Product button as shown below

    webkul blog

    Clicking on the ‘Product’ button will take you to the page shown below with a list of products on which FAQ has been added.

    When the Admin will click on the ‘Product FAQ’ button, he will be able to edit/delete/enable/disable the FAQ

    product faq

    After clicking on ‘Product FAQ’ button, this is what you will have:

    erwr

    Now, to display the FAQ on the frontend, the Admin needs to do some Code Pasting He needs to go to the Shopify Backend >> Online Store >> Themes >> Actions >> Edit Code

    product flag

    Search for the file product-template.liquid file >> Paste the code given below >> Save

    wallet app demo Themes Shopify

    paste the given code in product-template.liquid file{{ '//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css' | stylesheet_tag }}{{ '//code.jquery.com/jquery-1.10.2.js' | script_tag }}{{ '//code.jquery.com/ui/1.11.4/jquery-ui.js' | script_tag }}<divid='wk_product_faq'></div>

    After this, this is how the FAQ will be visible on the frontend

    product faq

    This is all about the workflow. For more, check out the main blog and demo of this app.

    Product FAQ Main Blog

    Main Blog

    Product FAQ Demo

    Check out the Demo

    Contact Us

    In case of any query, please drop an email at [email protected] or raise a ticket at Webkul UV Desk.

    . . .
    Discuss on Helpdesk

    Leave a Comment

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


    Be the first to comment.

    Back to Top