{"id":73650,"date":"2012-03-13T12:00:23","date_gmt":"2012-03-13T16:00:23","guid":{"rendered":"http:\/\/wpmu.org\/?p=73650"},"modified":"2013-07-24T20:27:28","modified_gmt":"2013-07-25T00:27:28","slug":"addquicktag","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/addquicktag\/","title":{"rendered":"Implement Custom HTML & CSS with the Click of a Button – Introducing AddQuicktag"},"content":{"rendered":"

\"ImplementI use custom CSS and HTML that is not featured in the Visual Editor for a few different reasons. For example, I apply CSS to image attributions, blocks of text, and so on. And you know what? I’m just plain lazy.<\/strong> Going into the HTML editor and manually typing in code is just a step too far for me.<\/p>\n

So for some time I have been searching for a plugin that will facilitate my laziness. A quicktags plugin that works with the Visual Editor as well as the HTML editor. I finally found one – and it works a treat<\/strong>.<\/p>\n

AddQuicktag<\/h2>\n

Some of the best things in life are simple, and this is no exception. In a nutshell, AddQuicktag<\/a>\u00a0allows you to wrap text with, well, anything:<\/p>\n

\"AddQuicktags\"
Using AddQuicktags to set up one-click custom CSS styling.<\/figcaption><\/figure>\n
\"AddQuicktags\"
Implementing the CSS styling with the click of a button.<\/figcaption><\/figure>\n

Although the plugin’s obvious application is to facilitate the easy implementation of custom CSS stylings or HTML tags that do not feature in the Visual Editor, you are really only limited by your imagination in what you can do<\/strong>. For instance, I often like to embed tweets on my personal blog posts, like this:<\/p>\n

\"Embedded<\/p>\n

Before I found AddQuicktag, embedding these tweets was a pain. This was the code:<\/p>\n

{code type=html}<\/p>\n

(<a title=”Tweet This Quote” href=”https:\/\/twitter.com\/intent\/tweet?text=yourtweethere” rel=”nofollow” target=”_blank”>tweet this<\/a>).<\/p>\n

<\/code><\/p>\n

I’d find the code from the last post I’d used an embedded tweet, paste it into the new post, and replace the tweet text. But now I have set up a shortcut via AddQuicktag:<\/p>\n

\"Embedded<\/p>\n

All I do now when I want to embed a tweet is switch to the HTML editor, hit my new “Embedded Tweet” button, enter the contents of the tweet itself, then hit the button again to close off the tag. Simple!<\/p>\n

Download AddQuicktag here<\/a>.<\/p>\n

What Will YOU Use AddQuicktag For?<\/h2>\n

As I said above, there are multiple potential applications for this plugin, and you could no doubt do plenty of other time saving things with it. If you like the plugin and will be using it, let us know how!<\/strong><\/p>\n\n

Creative Commons photo courtesy of\u00a0Jesper R\u00c3\u00b8nn-Jensen<\/a><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

Save time and automate HTML and CSS styling and code with this handy plugin!<\/p>\n","protected":false},"author":84405,"featured_media":73656,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[4],"tags":[1044,200,2186],"tutorials_categories":[],"class_list":["post-73650","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-plugins","tag-css","tag-html","tag-wordpress-editor"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/73650","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/84405"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=73650"}],"version-history":[{"count":1,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/73650\/revisions"}],"predecessor-version":[{"id":217687,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/73650\/revisions\/217687"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/73656"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=73650"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=73650"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=73650"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=73650"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}