Reading list Switch to dark mode

    YouTube Channel Feed for Magento 2

    Updated 19 March 2024

    Magento 2 YouTube extension allows the store owner to show the latest feeds from the YouTube channel.

    The customers can view the latest video updates from the YouTube channel without leaving the store.

    Apart from that, the admin can customise the height, width, several feeds show, and the wall data colour.

    Check a brief overview of the plugin working and configuration in the video below –

    p2TnWRt5jhE

    Features

    • Set the number of video feeds to display in the widget.
    • Set the YouTube Channel Feed widget text colour, hover colour.
    • Customize the height and width of the widget.
    • Show/hide video thumbnails in the widget.
    • Select the store view for every widget.
    • A customer can click the Subscribe button in the widget.
    • YouTube channel name, logo, the banner is shown.
    • View widget in List or Grid layout.
    • YouTube video player embedded in the widget.
    • Source code is open for customization.

    Installation – Magento 2 YouTube Channel Feeds

    To install this extension, please follow every step carefully as follows:

    Searching for an experienced
    Magento 2 Company ?
    Find out More

    Step 1:

    After extracting the downloaded zip file and you will get the src folder. Inside the src folder, you will find the app folder, copy the app folder to the Magento2 root directory. Please view the below screenshot.

    YouTube Channel Feed- Installation

    Step 2:

    After the successful installation, you have to run these commands in the Magento2 root directory.

    First command- php bin/magento setup:upgrade

    YouTube-installation2

    Second Command – php bin/magento setup:di:compile
    YouTube Channel Feed-installation3

    Third Command – php bin/magento setup:static-content:deploy
    YouTube Channel Feed-installation4

    After running the commands, you need to flush the cache and reindex it all from the Magento2 admin panel. Navigate through System>Cache Management. Click the Flush Magento Cache button as shown below:

    YouTube Channel Feed- Magento2 Cache Management

    How to Get YouTube API

    For getting the YouTube API, please log into your Google account and visit this link. Now click on My Project and create a new project by clicking on New Project.

    YouTube Channel Feed- new project

    Now enter any name for this New Project and click Create button.

    YouTube- new project 2

    After creating your New Project, click ENABLE API button and then select Youtube Data API v3.

    youtube data API v 3

    Then, click on the Enable button and after that, the Create Credentials button will appear, click on the Create Credentials button.

    create credentials

    The following page will open, now fill in the required details and click on What credentials do I need?

    create api 2

    Finally, you can now copy the API Key created.

    Add API credentials

    Module Configuration

    After the module installation, the admin needs to enter the YouTube API key to make this module work. Go to Stores>Configuration>YouTube Channel Feed>Configuration setting.

    192.168.15.90_Youtubep4_pub_admin_admin_system_config_index_key_d7faa7f42c9b85a8923cf88280aa8d2adb8ea1bb30b8808c1bca5b25fa88417a_ (1)

    YouTube Channel Feed Enable/Disable – Select the Yes option to enable the module, else select No to disable it.

    The admin can select the Individual option for using the API key widget wise and the option for entering the API key will appear on the particular widget page.

    192.168.15.90_Youtubep4_pub_admin_admin_system_config_index_key_d7faa7f42c9b85a8923cf88280aa8d2adb8ea1bb30b8808c1bca5b25fa88417a_

    If the admin wants to use the API key globally then he needs to select the Global option and after selecting the global option the Youtube API key tab will appear for entering the API key.

    Configuration-Settings-Stores-Magento-Admin (1)

    Widget Configuration

    Now, the admin can navigate to Content>Pages and select the page where it wants to display the YouTube Channel Feed widget, click Edit option.

    192.168.15.90_Youtubep4_pub_admin_cms_page_index_key_f20bc03d62022813058deb3d0996e4b1b006647a9cefb32f46784ab9be4bb40e_

    Now, in the Content section, and click the Insert Widget icon.

    192.168.15.90_Youtubep4_pub_admin_cms_page_edit_page_id_5_key_686d7a81dba1c8aaa4b301c74635bceb844b94407a8c1e56f4e16624f85ea983_

    A pop-up window will appear, select Widget Type as YouTube Channel Feed and click Insert Widget.

    select widget

    After that, the following options will be available for the YouTube Channel Feed:

    Widget Options:

    YouTube API Key – Enter your API credential here.

    Youtube Channel ID –  Go to the YouTube website and open the channel page. You will find the Channel address in the browser’s address bar.

    Enter YouTube channel ID from where the videos will be shown. eg. UCoMjhTMLPrcPpVOkIDHXiSA

    youtube channel ID

    YouTube Username – The admin needs to put the same channel ID here.

    No. of Max Feed –  Enter the number of video feeds to display in the widget.

    Wall Data Color – Set the widget text color.

    Wall Data Color on Hover – Set color when a user hovers over a title.insert widget

    Channel Title Color: Set the color for the channel title.

    Channel Title Color on Hover: Set the channel title color when a user hovers over the title.

    Width – Set the width of the widget. eg. 1024

    Height – Set the height of the widget. eg. 500

    Show Media Images – Select Yes to display video thumbnails in the widget, else select No.

    Select Stores – Select which store view, and the widget will be visible.

    Click Insert Widget when done.

    insert widget 2

    After setting up the widget options, the widget will appear in the content section. Click Save Page to apply your changes.

    widget-added

    User Front-End View

    On the front-end, this is how the YouTube Channel Feed widget will appear. The users will be viewing the channel name, logo, banner, description, the number of subscribers.

    youtube

    Two types of layout options will be available – Grid and List view.

    List LayoutA one-click pop-up YouTube video player will appear when a customer clicks any thumbnail images.

    YouTube Channel Feed Pop-up video player

    No need to visit the YouTube website anymore, because your customers can directly watch the YouTube videos on your Magento website.

    YouTube video player is embedded in the widget, showing all the controls for video playback.

    youtube video controls

    Thank you for viewing this blog. If you have any query or need more information, please visit the HelpDesk System.

    Current Product Version - 5.0.2-p1

    Supported Framework Version - Magento 2.0.x, 2.1.x, 2.2.x,2.3.x, 2.4.x

    . . .

    Leave a Comment

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


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content