gingersoulrecords / wordpen Goto Github PK
View Code? Open in Web Editor NEWA plugin to embed HTML/CSS/JS snippets and files via Shortcodes
A plugin to embed HTML/CSS/JS snippets and files via Shortcodes
=== WordPen === Contributors: gingersoulrecords,ideag Donate link: http://gingersoulrecords.com/ Tags: codepen, snippets Requires at least: 4.6 Tested up to: 4.7 Stable tag: 0.1.0 License: GPLv2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Embed pens from CodePen without the 'edit' frame == Description == [CodePen](http://codepen.io/) is a 'playground for the front end web' where you can write public-facing HTML/CSS/JS demos, called pens. It's a fountain of inspiration for web designers and a useful resource for those learning to write, organize, and share front end code. WordPen by [Ginger Soul Records](https://gingersoulrecords.com/) is an effort to bring the best of CodePen to WordPress, with minimal code work. Simply paste a CodePen URL, save your WordPen, and embed a shortcode in your layout. HTML, CSS, and JS code will be editable, and all connected resources linked to the pen will be included with the shortcode. Not all pens were designed to be featured with WordPen, so you may wish to start with background- and foreground-friendly pens, which are collected [here](http://codepen.io/gingersoulrecords/collections/public/). == Installation == 1. Upload the plugin files to the `/wp-content/plugins/wordpen` directory, or install the plugin through the WordPress plugins screen directly. 1. Activate the plugin through the 'Plugins' screen in WordPress 1. Use the `WP Admin -> WordPens > Add New` screen import new pens == Frequently Asked Questions == = How do I make this plugin work? = Go to `WP Admin > WordPens > Add new` and import a new pen from Codepen. Then use the shorcode provided there, to insert the pen into any WordPress post/page/custom post type. == Screenshots == 1. Pen Editor Screen 2. Pen Editor Screen (continued) == Changelog == = 0.1.0 = * first version to be submitted to wordpress.org == Upgrade Notice == = 0.1.0 = Initial version
I just received an informal notice from WP plugin team that we should have different banner images icons for different plugins. They do not need to be completely different, but they need to be individualized
Hey, I left a message in Slack to this effect. I wasn't able to pull requisite CSS/JS into the Document on GSR Developer (there's a pen called Neon Soup in there).
Manually copying and pasting the JS into a scripts file ended up working. Please take a look, thx :)
DB
Hey there!
I'd like you to select three of your favorite background pens and three of your favorite foreground pens from GSR's 'loved' list, here:
http://codepen.io/gingersoulrecords/pens/loved/
fork them, and convert them to WordPen-friendly formats (single container element, no global CSS or fixed/absolute positioning). I'd like to know what challenges you face doing this, so we can write some useful instructions for WordPen users to prepare their own pens for website use.
Thanks!
DB
Hi, for submitting to WP.org there are a couple of things you would be better at doing, than I would:
P.S. is gsr username on wordpress.org yours? it seems to be registered but never used really used. If it is, could you give me access to that account - I'll do your submissions using it.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.