{"id":27092,"date":"2014-01-06T02:09:18","date_gmt":"2014-01-06T02:09:18","guid":{"rendered":"https:\/\/wordpress.org\/plugins-wp\/codepen-embedded-pen-shortcode\/"},"modified":"2024-10-01T17:43:20","modified_gmt":"2024-10-01T17:43:20","slug":"codepen-embedded-pen-shortcode","status":"publish","type":"plugin","link":"https:\/\/ru.wordpress.org\/plugins\/codepen-embedded-pen-shortcode\/","author":127030,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"1.0.3","stable_tag":"trunk","tested":"6.6.5","requires":"2.6","requires_php":"","requires_plugins":null,"header_name":"CodePen Embedded Pens Shortcode","header_author":"Chris Coyier","header_description":"","assets_banners_color":"","last_updated":"2024-10-01 17:43:20","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"","header_author_uri":"https:\/\/codepen.io","rating":4.3,"author_block_rating":0,"active_installs":900,"downloads":32740,"num_ratings":6,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":[],"upgrade_notice":[],"ratings":{"1":1,"2":0,"3":0,"4":0,"5":5},"assets_icons":[],"assets_banners":[],"assets_blueprints":{},"all_blocks":[],"tagged_versions":[],"block_files":[],"assets_screenshots":{"screenshot-2.png":{"filename":"screenshot-2.png","revision":3161046,"resolution":"2","location":"plugin"},"screenshot-1.png":{"filename":"screenshot-1.png","revision":3161046,"resolution":"1","location":"plugin"},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3161046,"resolution":"3","location":"plugin"}},"screenshots":{"1":"An Embedded Pen","2":"Settings Page","3":"Editor with Shortcode"},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[],"plugin_category":[],"plugin_contributors":[],"plugin_business_model":[],"class_list":["post-27092","plugin","type-plugin","status-publish","hentry","plugin_committers-chriscoyier"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/s.w.org\/plugins\/geopattern-icon\/codepen-embedded-pen-shortcode.svg","icon_2x":false,"generated":true},"screenshots":[{"src":"https:\/\/ps.w.org\/codepen-embedded-pen-shortcode\/trunk\/screenshot-1.png?rev=3161046","caption":"An Embedded Pen"},{"src":"https:\/\/ps.w.org\/codepen-embedded-pen-shortcode\/trunk\/screenshot-2.png?rev=3161046","caption":"Settings Page"},{"src":"https:\/\/ps.w.org\/codepen-embedded-pen-shortcode\/trunk\/screenshot-3.png?rev=3161046","caption":"Editor with Shortcode"}],"raw_content":"\n

Allows the use of a special shortcode [codepen_embed]<\/code> for embedding Pens from CodePen<\/a>.<\/p>\n\n

You can learn more about CodePen here<\/a> and about this plugin here<\/a>.<\/p>\n\n

Basic Usage<\/h3>\n\n
[codepen_embed height=300 theme_id=1 slug_hash='jwGBh' user='arasdesign' default_tab='html' animations='run']\n  See the Pen <a href='https:\/\/codepen.io\/arasdesign\/pen\/jwGBh'>Flat minion<\/a> by Amin Poursaied (<a href='https:\/\/codepen.io\/arasdesign'>@arasdesign<\/a>) on <a href='https:\/\/codepen.io'>CodePen<\/a>\n[\/codepen_embed]\n<\/code><\/pre>\n\n
The Point<\/h3>\n\n
    \n
  1. You can use shortcodes in the \"Visual\" editor. CodePen Embeds are copy-and-paste HTML that don't work when using the editor that way. If you ever use the Visual editor in WordPress, you'll probably want to use this plugin.<\/p><\/li>\n
  2. You can set a default theme, or override any theme set via Shortcode attribute.<\/p><\/li>\n
  3. Hopefully eventually this plugin will have more functionality. Like have a fancy UI for picking Pens to embed and more control over the HTML output.<\/p><\/li>\n<\/ol>\n\n\n
    For old school manual installation people: copy the folder \"codepen_embed\" into the \/wp-content\/plugins\/ folder. Then go to the Plugins area of the Admin and activate. Otherwise, search for \"CodePen Embed\" from the admin area of your WordPress site in Plugins > Add New.<\/p>\n\n\n
    \n
    What is CodePen?<\/h3><\/dt>\n
    CodePen<\/a> is a web app that allows anyone to create things with HTML, CSS, and JavaScript.<\/p><\/dd>\n
    Why is this useful?<\/h3><\/dt>\n
    Shortcodes are clean! You can already copy and paste JavaScript or iframe code to embed a Pen onto a WordPress page, but you need to make sure to be in the \"HTML\" tab of the writing area. If a user is in the \"Visual\" (default) tab, the embed code will not work. Short codes will work either way.<\/p>\n\n
    You can also manage the default theme of the embeds with this plugin.<\/p><\/dd>\n\n<\/dl>\n\n\n
      \n
    • 0.1 - Beta<\/li>\n
    • 0.2 - Adding line_numbers attribute<\/li>\n
    • 0.3 - Default for data_animations<\/code> is now run<\/code>, as documented.<\/li>\n
    • 0.4 - Added preview<\/code> attribute. Removed line numbers attribute.<\/li>\n
    • 0.5 - Defaulting to v2 of Embeds by default<\/li>\n
    • 0.6 - Make sure theme_id=\"light\"<\/code> and theme_id=\"dark\"<\/code> work.<\/li>\n
    • 0.7 - Making sure data_edtiable<\/code> support editable embeds.\n\n
        \n
      • 0.7.1 - Fixing naming thing<\/li>\n<\/ul><\/li>\n
      • 0.8 - Updating location of CodePen's embed script<\/li>\n
      • 1.0.2 - Bug fixes<\/li>\n
      • 1.0.3 - Bug fixes<\/li>\n<\/ul>","raw_excerpt":"Allows the use of a special shortcode [codepen_embed] for embedding Pens from CodePen.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/27092","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=27092"}],"author":[{"embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/chriscoyier"}],"wp:attachment":[{"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=27092"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=27092"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=27092"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=27092"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=27092"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/ru.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=27092"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}