Features<\/span><\/h3>\n<\/div>\n<\/div>\n\n\n- Color customization for news text and also for the background.<\/li>\n
- Set the news ticker\u00a0width and scrolling speed.<\/li>\n
- Easily add the widget of the News Ticker.<\/li>\n
- Add more than one widget of News Ticker.<\/li>\n
- Each widget will work according to their group property.<\/li>\n
- The user can pause and also resume the scrolling animation.<\/li>\n
- Create, update, or remove any number of news text.<\/li>\n
- Add, edit, or delete various news ticker groups.<\/li>\n
- Two types of animation effects are available – linear and swing.<\/li>\n
- No need to install the\u00a0flash plugin to use this module.<\/li>\n
- Newsticker direction can be set to either left or right.<\/li>\n
- Enable or disable any news or a group from the\u00a0back-end.<\/li>\n
- Add group information – group title, group code, and group name<\/li>\n
- Supports multiple languages and translations.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n\n\n\n
Installation<\/span><\/h3>\n<\/div>\n<\/div>\n\n\nAfter the purchase of News Ticker for Magento 2, customers will get a zip folder.<\/strong> They have to extract the contents of this zip folder on their system. The extracted folder has an src<\/strong> folder, inside the src folder you have the app<\/strong> folder. You need to transfer this app<\/strong> folder into the Magento2 root directory on the server as shown below.<\/p>\n![\"Installation](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Move-app-folder-2.png\")
<\/a><\/p>\nAfter the successful installation, you also have to run these commands in the Magento2 root directory.<\/p>\n
First command- php bin\/magento setup:upgrade<\/strong><\/p>\n![\"cmd1\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command1-upgrade-3.png\")
<\/a><\/p>\nSecond Command – php bin\/magento setup:di:compile<\/strong>
![\"cmd2\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command2-compile-2.png\")
<\/a><\/p>\nThird Command – php bin\/magento setup:static-content:deploy<\/strong>
![\"cmd3\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2017\/06\/command3-deploy-1.png\")
<\/a><\/p>\nAfter running the commands, you have to flush the cache from the Magento admin panel by navigating through->System->Cache management<\/strong> as shown below.<\/p>\n![\"Installation](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Flush-Cache-1.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nMultilingual Support<\/span><\/h3>\n<\/div>\n<\/div>\n\nFor the multilingual <\/strong>support, the admin will navigate through Store->Configuration->General ->Locale Options<\/strong> and select the locale as German (the language into which the admin wants to translate his store content).<\/p>\n![\"Configuration](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2015\/12\/LAnguage-1.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\nLanguage Translation<\/span><\/h3>\n<\/div>\n\nIf the user wants to translate their module from English to German then they need to follow the path app\/code\/Webkul\/NewsTicker\/i18n<\/strong> in their unzipped Magento2 News Ticker folder and will get a CSV file with the name \u201cen_US.csv\u201d. Now they will rename that CSV as \u201cde_DE.csv\u201d and also translate all right side content after the comma in the German language. After editing the CSV, save it and then upload it to the path app\/code\/Webkul\/NewsTicker\/i18n<\/strong> where they have installed Magento2 on the server. The module will also get translated into the German Language. It supports both RTL <\/strong>and LTR <\/strong>languages.<\/p>\n![\"file](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Screenshot-from-2018-04-09-15-09-34.png\")
<\/a><\/p>\n![\"translate](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Screenshot-from-2018-04-09-15-26-01.png\")
<\/a><\/p>\nThe user can edit the CSV like the image below.
![\"Magento2](\"http:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2015\/12\/Translation3.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nNews Ticker Configuration<\/span><\/h3>\n<\/div>\n<\/div>\n\n\nLater, the installation of the module, the admin will see the News Ticker menu. Inside the News Ticker menu you will find – Manage News and Manage Groups menu options.<\/p>\n
![\"new](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/new-menu.jpg\")
<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\n\nNews Ticker –<\/span> Manage News<\/span><\/h3>\n<\/div>\n\n\nClicking on the Manage News menu option, the admin can view, add, edit, or delete the news.<\/p>\n
Add News<\/strong> – To create news for the news ticker, click the Add News button.<\/p>\nActions<\/strong> – Use this option to delete, enable, or disable any news from the list.<\/p>\nFilters<\/strong> – To find any specific news from the list, use this option.<\/p>\nEdit<\/strong> – For editing or updating any news, click Edit.<\/p>\n![\"manage](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/manage-news-1.jpg\")
<\/a><\/p>\nAdd News<\/h3>\n
Afterward, clicking on Add News, the news form opens as per the screenshot. The admin can enter the news in the text box and can also enable the status of the news added.<\/p>\n
News Information:<\/strong><\/p>\nNews<\/strong> – Enter the content of this news.<\/p>\nText Color<\/strong> – Set the text color for this news.<\/p>\nSort Order<\/strong> – \u00a0Set the order of this news.<\/p>\nStatus<\/strong> – Set the status as Enabled to use this news, else select Disabled.<\/p>\nClick the Save News<\/strong> button to save your changes.<\/p>\n![\"add](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/add-news.jpg\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nNews Ticker<\/span> –<\/span> Manage Group<\/span><\/h3>\n<\/div>\n<\/div>\n\n\n\u00a0Afterward, clicking the Manage Group<\/strong> option, the following page will open. From here the admin can view all the news ticker groups. Information such as Group Title, Name, Code, Display Type, Speed, News IDs, and Status are visible.<\/p>\nAdd Group<\/strong> – To create a new group, click the Add Group button.<\/p>\nActions<\/strong> – Use this option to Enable, Disable, or Delete a group from the list.<\/p>\nFilters<\/strong> – To find any group from the list, use this option.<\/p>\nEdit<\/strong> – For updating an existing group, click Edit.<\/p>\n![\"manage](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/manage-group.jpg\")
<\/a><\/p>\nAdd Group<\/h3>\n
To create a news ticker group, the admin needs to provide the following information. After providing the group information go to Group News and select the news from the list.<\/p>\n
![\"new](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/new-group.jpg\")
<\/a><\/p>\nHere the admin will enter –<\/p>\n
\n- Group Name<\/strong> – Enter the name for the group that will contain various similar news<\/li>\n
- Group Title<\/strong> – Set the group’s title<\/li>\n
- Group Code<\/strong> – Set the group code<\/li>\n
- Direction<\/strong> – Set the news ticker animation direction<\/strong> to Left<\/strong> or Right<\/strong><\/li>\n
- Display Type<\/strong> – Set the animation display type as Swing<\/strong> or Linear<\/strong><\/li>\n
- Background Color<\/strong> – Set the background color of the news<\/li>\n
- Group Width<\/strong> – Set the width of the newsgroup<\/li>\n
- Group Speed<\/strong> – Set the animation speed of the group<\/li>\n
- Status<\/strong> – Set the status<\/strong> of the news as Enabled<\/strong> or Disabled<\/strong><\/li>\n<\/ul>\n
Group News<\/h3>\n
Moreover, now the admin needs to select the news for the group. Use the checkbox to select the news items for the group. The selected news will be visible in the news ticker. Click the Save Group<\/strong> button to apply your changes made.<\/p>\n![\"select](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/select-news.jpg\")
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nAdding News Ticker CMS Block Code<\/span><\/h3>\n<\/div>\n<\/div>\n\n\u00a0Furthermore, you have added the group, you can customize the page you want to show the news ticker in. In the Admin panel go to Content->pages<\/strong> and the list of pages will appear. From any page, the admin can click on the edit option to edit the content section for customizing the front page news ticker.<\/p>\n![\"pages\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/pages.jpg\")
<\/a><\/p>\n\nGo to the Content section and enter the news ticker block code as appears in the screenshot below.<\/p>\n
This is a sample code for a news ticker.<\/p>\n
{{block class=”Webkul\\NewsTicker\\Block\\Group\\Group” group_code=”test_group” template=”Webkul_NewsTicker::group.phtml”}}<\/strong><\/p>\n\nNote<\/strong><\/div>\n<\/div>\nIn the case of block call at CMS page, You will have to write (\u201c) in HTML otherwise, if you simply copy these codes on WYSIWYG editor then it will convert the double quote into some ASCII code and you will unable to call block on CMS page.<\/p>\n
It will look like this on the CMS page.<\/p>\n
{{block class=”Webkul\\NewsTicker\\Block\\Group\\Group” group_code=”test_group” template=”Webkul_NewsTicker::group.phtml”}}<\/strong><\/p>\n<\/p>\n![\"block](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/block-code.jpg\")
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nAdding News Ticker Widget<\/span><\/h3>\n<\/div>\n<\/div>\n\nBut to add a news ticker widget the admin will navigate to Content<\/strong>>Pages<\/strong>.\u00a0 Add a new page or use an existing one to add the news ticker.
![\"Pages](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Pages-Add-Edit.png\")
<\/a><\/p>\nAfterward, now, to add the news ticker click the Add New Page<\/strong> button on the top right-hand corner or use an already created page. This brings up the section to add a new page. And enter the Page Title <\/strong>and then go to the Content<\/strong> section. Enter the content heading<\/strong> and within the editor<\/strong> click the add widget<\/strong> button.
![\"Pages](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Click-Widget-Icon.png\")
<\/a><\/p>\nMoreover, Clicking the widget brings up the section to add the widget. For the Widget, Type<\/strong> selects the News Ticker<\/strong> widget from the drop-down option. The Widget Options <\/strong>select the News Group<\/strong> that you want to display at the front-end. Now, click the Insert Widget<\/strong> button.
![\"Insert](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Insert-Wedget.png\")
<\/a><\/p>\nAfterward inserting the widget, click the Save<\/strong> button at the top-right hand side and now you are done configuring the News Ticker at your required page.
![\"Widget](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Widget-Save.png\")
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nFront-End View of News Ticker<\/span><\/h3>\n<\/div>\n<\/div>\n\nHere is the sample News Ticker appearing on the homepage. Different text colors have been set for groups showing multiple news items.<\/p>\n
![\"g\"](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2016\/09\/Screenshot-from-2019-11-22-16-30-09.png\")
<\/p>\n<\/div>\n<\/div>\n
Moreover, Thank you for viewing this blog. If you have any issues, please visit webkul.uvdesk.com<\/a><\/p>\n\n\n
- \n
- Color customization for news text and also for the background.<\/li>\n
- Set the news ticker\u00a0width and scrolling speed.<\/li>\n
- Easily add the widget of the News Ticker.<\/li>\n
- Add more than one widget of News Ticker.<\/li>\n
- Each widget will work according to their group property.<\/li>\n
- The user can pause and also resume the scrolling animation.<\/li>\n
- Create, update, or remove any number of news text.<\/li>\n
- Add, edit, or delete various news ticker groups.<\/li>\n
- Two types of animation effects are available – linear and swing.<\/li>\n
- No need to install the\u00a0flash plugin to use this module.<\/li>\n
- Newsticker direction can be set to either left or right.<\/li>\n
- Enable or disable any news or a group from the\u00a0back-end.<\/li>\n
- Add group information – group title, group code, and group name<\/li>\n
- Supports multiple languages and translations.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n\n\n\n
Installation<\/span><\/h3>\n<\/div>\n<\/div>\n
\n\nAfter the purchase of News Ticker for Magento 2, customers will get a zip folder.<\/strong> They have to extract the contents of this zip folder on their system. The extracted folder has an src<\/strong> folder, inside the src folder you have the app<\/strong> folder. You need to transfer this app<\/strong> folder into the Magento2 root directory on the server as shown below.<\/p>\n
<\/a><\/p>\nAfter the successful installation, you also have to run these commands in the Magento2 root directory.<\/p>\n
First command- php bin\/magento setup:upgrade<\/strong><\/p>\n
<\/a><\/p>\nSecond Command – php bin\/magento setup:di:compile<\/strong>
<\/a><\/p>\nThird Command – php bin\/magento setup:static-content:deploy<\/strong>
<\/a><\/p>\nAfter running the commands, you have to flush the cache from the Magento admin panel by navigating through->System->Cache management<\/strong> as shown below.<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nMultilingual Support<\/span><\/h3>\n<\/div>\n<\/div>\n
\nFor the multilingual <\/strong>support, the admin will navigate through Store->Configuration->General ->Locale Options<\/strong> and select the locale as German (the language into which the admin wants to translate his store content).<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n\n\nLanguage Translation<\/span><\/h3>\n<\/div>\n
\nIf the user wants to translate their module from English to German then they need to follow the path app\/code\/Webkul\/NewsTicker\/i18n<\/strong> in their unzipped Magento2 News Ticker folder and will get a CSV file with the name \u201cen_US.csv\u201d. Now they will rename that CSV as \u201cde_DE.csv\u201d and also translate all right side content after the comma in the German language. After editing the CSV, save it and then upload it to the path app\/code\/Webkul\/NewsTicker\/i18n<\/strong> where they have installed Magento2 on the server. The module will also get translated into the German Language. It supports both RTL <\/strong>and LTR <\/strong>languages.<\/p>\n
<\/a><\/p>\n<\/a><\/p>\nThe user can edit the CSV like the image below.
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nNews Ticker Configuration<\/span><\/h3>\n<\/div>\n<\/div>\n
\n\nLater, the installation of the module, the admin will see the News Ticker menu. Inside the News Ticker menu you will find – Manage News and Manage Groups menu options.<\/p>\n
<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\nNews Ticker –<\/span> Manage News<\/span><\/h3>\n<\/div>\n
\n\nClicking on the Manage News menu option, the admin can view, add, edit, or delete the news.<\/p>\n
Add News<\/strong> – To create news for the news ticker, click the Add News button.<\/p>\n
Actions<\/strong> – Use this option to delete, enable, or disable any news from the list.<\/p>\n
Filters<\/strong> – To find any specific news from the list, use this option.<\/p>\n
Edit<\/strong> – For editing or updating any news, click Edit.<\/p>\n
<\/a><\/p>\nAdd News<\/h3>\n
Afterward, clicking on Add News, the news form opens as per the screenshot. The admin can enter the news in the text box and can also enable the status of the news added.<\/p>\n
News Information:<\/strong><\/p>\n
News<\/strong> – Enter the content of this news.<\/p>\n
Text Color<\/strong> – Set the text color for this news.<\/p>\n
Sort Order<\/strong> – \u00a0Set the order of this news.<\/p>\n
Status<\/strong> – Set the status as Enabled to use this news, else select Disabled.<\/p>\n
Click the Save News<\/strong> button to save your changes.<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nNews Ticker<\/span> –<\/span> Manage Group<\/span><\/h3>\n<\/div>\n<\/div>\n
\n\n\u00a0Afterward, clicking the Manage Group<\/strong> option, the following page will open. From here the admin can view all the news ticker groups. Information such as Group Title, Name, Code, Display Type, Speed, News IDs, and Status are visible.<\/p>\n
Add Group<\/strong> – To create a new group, click the Add Group button.<\/p>\n
Actions<\/strong> – Use this option to Enable, Disable, or Delete a group from the list.<\/p>\n
Filters<\/strong> – To find any group from the list, use this option.<\/p>\n
Edit<\/strong> – For updating an existing group, click Edit.<\/p>\n
<\/a><\/p>\nAdd Group<\/h3>\n
To create a news ticker group, the admin needs to provide the following information. After providing the group information go to Group News and select the news from the list.<\/p>\n
<\/a><\/p>\nHere the admin will enter –<\/p>\n
- \n
- Group Name<\/strong> – Enter the name for the group that will contain various similar news<\/li>\n
- Group Title<\/strong> – Set the group’s title<\/li>\n
- Group Code<\/strong> – Set the group code<\/li>\n
- Direction<\/strong> – Set the news ticker animation direction<\/strong> to Left<\/strong> or Right<\/strong><\/li>\n
- Display Type<\/strong> – Set the animation display type as Swing<\/strong> or Linear<\/strong><\/li>\n
- Background Color<\/strong> – Set the background color of the news<\/li>\n
- Group Width<\/strong> – Set the width of the newsgroup<\/li>\n
- Group Speed<\/strong> – Set the animation speed of the group<\/li>\n
- Status<\/strong> – Set the status<\/strong> of the news as Enabled<\/strong> or Disabled<\/strong><\/li>\n<\/ul>\n
Group News<\/h3>\n
Moreover, now the admin needs to select the news for the group. Use the checkbox to select the news items for the group. The selected news will be visible in the news ticker. Click the Save Group<\/strong> button to apply your changes made.<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nAdding News Ticker CMS Block Code<\/span><\/h3>\n<\/div>\n<\/div>\n
\n\u00a0Furthermore, you have added the group, you can customize the page you want to show the news ticker in. In the Admin panel go to Content->pages<\/strong> and the list of pages will appear. From any page, the admin can click on the edit option to edit the content section for customizing the front page news ticker.<\/p>\n
<\/a><\/p>\n\nGo to the Content section and enter the news ticker block code as appears in the screenshot below.<\/p>\n
This is a sample code for a news ticker.<\/p>\n
{{block class=”Webkul\\NewsTicker\\Block\\Group\\Group” group_code=”test_group” template=”Webkul_NewsTicker::group.phtml”}}<\/strong><\/p>\n
\nNote<\/strong><\/div>\n<\/div>\nIn the case of block call at CMS page, You will have to write (\u201c) in HTML otherwise, if you simply copy these codes on WYSIWYG editor then it will convert the double quote into some ASCII code and you will unable to call block on CMS page.<\/p>\n
It will look like this on the CMS page.<\/p>\n
{{block class=”Webkul\\NewsTicker\\Block\\Group\\Group” group_code=”test_group” template=”Webkul_NewsTicker::group.phtml”}}<\/strong><\/p>\n<\/p>\n
<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\nAdding News Ticker Widget<\/span><\/h3>\n<\/div>\n<\/div>\n
\nBut to add a news ticker widget the admin will navigate to Content<\/strong>>Pages<\/strong>.\u00a0 Add a new page or use an existing one to add the news ticker.
<\/a><\/p>\nAfterward, now, to add the news ticker click the Add New Page<\/strong> button on the top right-hand corner or use an already created page. This brings up the section to add a new page. And enter the Page Title <\/strong>and then go to the Content<\/strong> section. Enter the content heading<\/strong> and within the editor<\/strong> click the add widget<\/strong> button.
<\/a><\/p>\nMoreover, Clicking the widget brings up the section to add the widget. For the Widget, Type<\/strong> selects the News Ticker<\/strong> widget from the drop-down option. The Widget Options <\/strong>select the News Group<\/strong> that you want to display at the front-end. Now, click the Insert Widget<\/strong> button.
<\/a><\/p>\nAfterward inserting the widget, click the Save<\/strong> button at the top-right hand side and now you are done configuring the News Ticker at your required page.
<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\nFront-End View of News Ticker<\/span><\/h3>\n<\/div>\n<\/div>\n
\nHere is the sample News Ticker appearing on the homepage. Different text colors have been set for groups showing multiple news items.<\/p>\n
<\/p>\n<\/div>\n<\/div>\nMoreover, Thank you for viewing this blog. If you have any issues, please visit webkul.uvdesk.com<\/a><\/p>\n\n\n
- Group Title<\/strong> – Set the group’s title<\/li>\n
- Group Name<\/strong> – Enter the name for the group that will contain various similar news<\/li>\n