npm

ifeeds

1.1.2 • Public • Published

ifeeds

One of the most useful features of Blogger is its ability to generate feeds, and based on this, I developed a plugin that creates widgets, allowing visitors with their own blogs and who enjoy your content to display your latest posts as a sign of appreciation.

Install

npm

npm i ifeeds

cdn

<script href="https://cdn.jsdelivr.net/npm/ifeeds@1/dist/js/feeds.min.js"></script>

Basic Usage

Builder Mode

It provides controls for users to configure the plugin, this would be the minimum structure:

<!-- Customizer -->
<div id="dev-customizer">
  <label>
    <input type="radio" name="direction" value="column" checked=""/> Column
  </label>
  <label>
    <input type="radio" name="direction" value="row"/> Row
  </label> 
  <input class="dev-input" type="number" value="4" min="3" max="9" name="max"/>
  <input class="dev-input" type="text" value="#ffffff" name="background"/>
  <input class="dev-input" type="text" value="#212121" name="title"/>
  <input class="dev-input" type="text" value="#212121" name="category"/>
  <input class="dev-input" type="text" value="#f1f1f1" name="categorybg"/>
  <input class="dev-input" type="text" value="#e6e6e6" name="border"/>
  <input class="dev-input" type="text" value="" name="label"/>
</div>

<!-- Preview -->
<div class="widget-feeds"></div>

<!-- Result -->
<div id="dev-results">
  <textarea spellcheck="false"></textarea>
  <button>Copy code</button>
</div>

Finally (after including feeds.js), use the initCustomizer method to use the script in "Creator" mode:

Feeds.initCustomizer()

Example: codepen.io/zkreations/pen/poOvXVY Custom example: codepen.io/zkreations/pen/zYJxZyR

Plugin Mode

In this mode, only the container is required:

<div class="widget-feeds"></div>

Now you need to initialize it using the initPlugin method to display the feed:

Feeds.initPlugin()

Options

Both previously mentioned methods share the same options, here is a table with more information:

Option Type Default
url string origin
max number 5
direction string column
image string https://i.imgur.com/snnjdGS.png
imageSize string w300-h240-c
title string #212121
category string #212121
categorybg string #f1f1f1
border string #e6e6e6
background string #ffffff
label string #ffffff
styles boolean true

License

feeds.js is licensed under the MIT License

Inspiration: somoskudasai

Readme

Keywords

none

Package Sidebar

Install

npm i ifeeds

Weekly Downloads

0

Version

1.1.2

License

MIT

Unpacked Size

33.2 kB

Total Files

13

Last publish

Collaborators

  • zkreations