Redeem Now
Read More
Read now
Menu Close
    Start a Project Request quote Reading list Switch to dark mode
    shopify-hyperlocal-marketplace-guide

    Product Flag for Shopify: Workflow

    Presentation Of Product Flag 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 Flag app by

    Visiting the Landing Page

    Enter your Shop URL & click on the Get This App button

    After approving the app charges, the installed app will be listed in the Apps section of Shopify Backend

    Clicking on the app, you will be redirected to the Homepage from where the Admin can navigate to different sections of the app i.e. Labelled Products, Collections, Configuration, All Flags/Labels & Label Rules.

    Firstly, the Admin needs to Configure this app

    The configuration includes General, Product Page, Home Page & Collection Page Settings

    In General Settings, Admin needs to enter the Domain Name of his Shopify Store

    In Product Page Settings, configure the position of the flag for the product description page

    In Collection Page Settings, configure the position of the flag for the collection page

    From home page settings, configure the position of the flag for the home page

    This is all for configuration. Now, the Admin will move towards adding product flag

    Adding Product Flags

    For this, Admin needs to go to

    Shopify Backend >> Products >> All Products >> Click on the particular product

    Click on the More Actions button & then click Manage Product Flag

    Clicking on it, the Admin will be redirected to the product flag app, select the product label, select the page on which he wants the labels to be visible and save.

    The product assigned with flags will be visible on the ‘Labelled Products’ page.

    Click on the ‘Labelled Products’ button.

    Here, the Admin will have a list of all the products with labels assigned to them. These can be edited/deleted from the same page.

    If the Admin wishes to edit the assigned labels on the products then click on the edit icon in the Action column

    Edit the labeled product & save the settings.

    This is how the Admin can add product labels. Admin can also add labels/flags on a whole collection.

    For this, click on the ‘Collection’ menu

    Here, the Admin will have a list of all the collections added on his Shopify store, to assign labels to them, click on the ‘edit’ icon under Action column.

    This is what you will get, select a label and save the setting.

    Now, the labels are added from both the products as well as the collections. To make them visible on the frontend, the Admin needs to do some code pasting.

    Paste the given codes in respective files

    product-template.liquid file

    <div id='wk_product_label'></div>

    collection-template.liquid file

    <div class='wk_collection_label' data-idproduct={{ product.id }} data-idprohand={{ product.handle }} id="wk_col{{ product.id }}"></div>

    Where to find these files?

    Shopify backend >> Online Store >> Themes >> Actions >> Edit Code

    Search for the file, paste the code and save.

    This is the Frontend View after all the code pasting is done

    Hoe Page
    Product Description Page

    This is all about the label assigning.

    Now, if the Admin wishes to add custom labels of this own choice rather then using the default labels of this app, then he can do so by going to the ‘All Flags/Labels’ menu.

    Going to this page, the Admin needs to click on the ‘+’ icon to add a new label, as shown in the image below:

    Enter the required details & save the ‘custom made label’.

    These added labels will be listed in the ‘All Flags/Labels’ page as shown below:

    If the Admin wishes to edit/delete/enable/disable these flag, he can do so from the same page.

    To edit the already added labels

    Click on the edit icon under the Action column, this is what you will get, edit the details and save.

    One last thing the Admin can do with this app is that he can configure the Label Rules for assigning automatic labels

    For this, click on the ‘Label Rules’ menu, select the rules which you wish to apply and save.

    This is all about the workflow for this app.

    Product Flag Main Blog

    Main Blog

    Product Flag Demo

    Demo Details

    Contact Us

    Please send your queries at support@webkul.com or raise a ticket at Webkul-UVdesk

    . . .

    Leave a Comment

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


    Be the first to comment.

    Back to Top
    css.php
    Hire Us!
    Brief us about your requirements and we'll get back to you.
    Woo! Hooy!
    We have just recieved your project brief and our expert will contact you shortly.
    Send Again
    Close