描述
🌉 WebComponent: Instagram Widget
Last 9 Photos: Instagram Widget of your Instagram Profile for your blog. Show latest 9 pics from your instagram account.
⛔ DISCLAIMER: This is an unofficial instagram library and offers no warranty! All trademarks and logos belong to their respective owners.
📎 Menu
- 💡 Features
- 🕹 Demo
- 👔 Screenshot
- 🚀 How to use
-
- 🌎 Web
-
- ⚛️ React
-
- 🅰️ Angular
- 📚 Documentation
- 🔨 Developer Mode
- 👨💻 Contributing
- 🐛 Known Bugs
- 🍻 Community:
💡 Features
- [✔️] Easy to use
- [✔️] MIT License
- [✔️] Without jQuery depencence
- [✔️] Configurable with attributes
- [✔️] Work with: Browserify / Webpack / ReactJS / Angular / WordPress
- [✔️] Photos Widget of your Instagram Profile for your blog or website with this WebComponent
- [✔️] Translations: 🇬🇧 🇮🇹 🇵🇱 (Help me ❤️)
📖 Installation
- Download wordpress-plugin and install it.
-
Add code to your html widget, example:
Appearance
–>Widget
–> insertHTML Widget
and paste html code:<instagram-widget username="@ptkdev" grid="3x3">
</instagram-widget>
NOTE: Replace @ptkdev
with your instagram username. More settings are available here.
You can insert this html code in posts, widget, html box or theme. Where you want see instagram photos box.
螢幕截圖
安裝
- Download wordpress-plugin and install it.
-
Add code to your html widget, example:
Appearance
–>Widget
–> insertHTML Widget
and paste html code:<instagram-widget username="@ptkdev" grid="3x3">
</instagram-widget>
NOTE: Replace @ptkdev
with your instagram username. More settings are available here.
You can insert this html code in posts, widget, html box or theme. Where you want see instagram photos box.
評價
貢獻者及開發者
修改日誌
v3.0.0-nightly (TBD)
- Feature: Fetch with instagram token/facebook open graph
- Refactor: move to typescript
v2.9.0 (March 04, 2021)
- API RATE LIMIT: Instagram added CORS to a public api
https://www.instagram.com/${this.options["username"]}/?__a=1
with?__a
get parameter and this widget stopped work. Current workaround: we use google images proxy - Security: Update
v2.8.0 (February 09, 2021)
- Fix: Can’t change default username #6
- Fix: localstorage with username as key (cache all usernames)
v2.7.1 (January 17, 2021)
- Feature: fetch from backup if get limit api request (from localStorage)
- Feature: loading spinner
- Feature: error fetch message
v2.6.1 (May 19, 2020)
- New: WordPress Plugin available on store.
v2.6.0 (May 18, 2020)
- Feature: Overwrite CSS Style with selector
::part
- New attribute: mouse-hover
- New attribute: show-title
- New attribute: shadows
- Fix: WordPress Plugin
v2.5.0 (May 04, 2020)
- Fix: now you can use multiple webcomponents in the same html page (#3)
- NOTE: better to use the full close tag
<instagram-widget></instagram-widget>
than short/>
v2.4.0 (May 02, 2020)
- New attribute:
force-square
- Feature: wordpress-plugin
v2.3.0 (May 01, 2020)
- Fix:
border-corners
andborder-spacing
now work withoutgrid
attribute. - Fix: NPM Module give errors with require/import
- Update: examples
v2.2.0 (April 30, 2020)
- Fix:
grid
now is more responsive (now usecalc()
function:100%
–spacing/padding/margin
) - Fix: default values now work (hello object reference my old dark friend)
v2.1.1 (April 28, 2020)
- New attribute: cache
- New attribute: border-corners
- New attribute: border-spacing
- Performance: now component send api request only if you change
username
- Fix: refresh attributes random don’t work
v2.0.0 (April 28, 2020)
- Removed “ptkdev-” prefix
- Module for Browserify/Webpack (run:
npm install @ptkdev/webcomponent-instagram-widget
) - Fix: Grid bug
- Installation guidelines: Browserify / Webpack / ReactJS / Angular / WordPress
v1.1.1 (April 27, 2020)
- Update CDN (New url!)
- Update build/dist
v1.1.0 (April 27, 2020)
- New attribute: items-limit
- New attribute: grid
- New attribute: image-width / image-height
v1.0.1 (April 26, 2020)
- Update CDN
v1.0.0 (April 26, 2020)
- First Release.