Repository files navigation

Framework7 Feeds plugin brings easy RSS feeds integration into Framework7 app.

Plugin comes with easy and powerful JS API to integrate and customize RSS feeds. But in most cases you will not need to use JavaScript at all.

Just grab plugin files fromdist/ folder or using npm:

npm install framework7-plugin-feeds

And link them to your app right AFTER Framework7's scripts and styles:

<link rel="stylesheet" href="path/to/framework7.min.css"><link rel="stylesheet" href="path/to/framework7.feeds.css">...<script src="path/to/framework7.min.js"></script><script src="path/to/framework7.feeds.js"></script>

After you included plugin script file, you need to install plugin before you init app:

// install plugin to Framework7Framework7.use(Framework7Feeds);// init appvarapp=newFramework7({  ...})

This plugin comes with ready to use ES module:

importFramework7from'framework7';importFramework7Feedsfrom'framework7-plugin-feeds';// install pluginFramework7.use(Framework7Feeds);// init appvarapp=newFramework7({  ...})

Plugin extends initiliazedapp instance with new methods:

• app.feeds.create(parameters) - init Feeds. This method returns initialized Feeds instance.
• app.feeds.get(feedsEl) - get Feeds instance by HTML element. Method returns initialized Feeds instance.
• app.feeds.destroy(feedsEl) - destroy Feeds instance

Usage example with manual initialization:

<divclass="list my-feed"></div>

varfeed=app.feeds.create({el:'.my-feed',feedUrl:'http://path-to-rss.com/rss.xml',openIn:'popup'});

If you need minimal parser setup you may use automatic initialization without JavaScript at all. In this case you need to add additionalfeeds-init class to feeds container and specify all parameters from table above usingdata- attributes, for example:

<div data-feed-url="http://path-to-rss.com/rss.xml" data-open-in="popup"></div>

Feeds plugin fully compatible with Pull To Refresh component, and will automatically refresh feed on pull to refresh. No additional actions or code are required.

Plugin comes with demo example to see how it works and looks. To make demo works you need to run in terminal:

$ npm run prod

All changes should be done only insrc/ folder. This project usesgulp to build a distributable version.

First you need to install all dependencies:

$ npm install

Then to build plugin's files for testing run:

$ npm run build:dev

If you need a local server while you developing you can run:

$ gulp server

or

$ npm run dev

And working demo will be available athttp://localhost:3000/demo/

https://framework7io.github.io/framework7-plugin-feeds/