{"id":884,"date":"2012-08-03T10:38:41","date_gmt":"2012-08-03T10:38:41","guid":{"rendered":"http:\/\/dev\/punch\/?page_id=884"},"modified":"2023-09-30T22:43:45","modified_gmt":"2023-09-30T21:43:45","slug":"buttons","status":"publish","type":"page","link":"https:\/\/beatsoop.com\/index.php\/shortcodes\/buttons\/","title":{"rendered":"Buttons"},"content":{"rendered":"[spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Standard Square Buttons<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nSmall Button<\/span><\/a>\nMedium button<\/span><\/a>\nLarge button<\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"standard\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"standard\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"standard\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Square Buttons with arrows<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nSmall Button<\/span><\/span><\/a>\nMedium button<\/span><\/span><\/a>\nLarge button<\/span><\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"squarearrow\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"squarearrow\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"squarearrow\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Slightly Rounded Buttons<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nSmall Button<\/span><\/a>\nMedium button<\/span><\/a>\nLarge button<\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"slightlyrounded\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"slightlyrounded\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"slightlyrounded\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Slightly Rounded Buttons with arrows<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nSmall Button<\/span><\/span><\/a>\nMedium button<\/span><\/span><\/a>\nLarge button<\/span><\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"slightlyroundedarrow\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"slightlyroundedarrow\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Rounded Buttons<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nSmall Button<\/span><\/a>\nMedium button<\/span><\/a>\nLarge button<\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"rounded\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"rounded\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"rounded\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Rounded Buttons with arrows<\/h2>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”first last”]\n[button colour=\"accent\" type=\"roundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"accent\" type=\"roundedarrow\" size=\"medium\" link=\"#\" target=\"_self]Medium button[\/button]\n[button colour=\"accent\" type=\"roundedarrow\" size=\"large\" link=\"#\" target=\"_self]Large button[\/button]\n[\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Coloured Buttons with arrows<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\nSmall Button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\nSmall button<\/span><\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”1\/1″ el_position=”first last”]\n[button colour=\"black\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small Button[\/button]\n[button colour=\"grey\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"lightgrey\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"purple\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"lightblue\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"turquoise\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"green\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"limegreen\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"orange\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[button colour=\"pink\" type=\"slightlyroundedarrow\" size=\"small\" link=\"#\" target=\"_self]Small button[\/button]\n[\/codesnippet] [blank_spacer height=”20px” width=”1\/1″ el_position=”first last”] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”]\n

Button effects<\/h2>\n[\/spb_text_block] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nOuter Glow Effect Button<\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"outerglow\" size=\"small\" link=\"#\" target=\"_self]Outer Glow Effect Button[\/button]\n[\/codesnippet] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”]\nDrop Shadow Effect Button<\/span><\/a>\n[\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”]\n[button colour=\"accent\" type=\"dropshadow\" size=\"small\" link=\"#\" target=\"_self]Drop Shadow Effect Button[\/button]\n[\/codesnippet] [blank_spacer height=”50px” width=”1\/1″ el_position=”first last”]\n","protected":false},"excerpt":{"rendered":"

[spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”] Standard Square Buttons [\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”] [\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”] Small Button Medium button Large button [\/codesnippet] [divider type=”dotted” text=”Go to top” full_width=”no” width=”1\/1″ el_position=”first last”] [spb_text_block pb_margin_bottom=”no” pb_border_bottom=”no” width=”1\/1″ el_position=”first last”] Square Buttons with arrows [\/spb_text_block] [spb_text_block pb_margin_bottom=”yes” pb_border_bottom=”no” width=”1\/3″ el_position=”first”] [\/spb_text_block] [codesnippet pb_margin_bottom=”yes” width=”2\/3″ el_position=”last”] Small Button Medium […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":8303,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"jetpack_post_was_ever_published":false,"footnotes":""},"aioseo_notices":[],"jetpack-related-posts":[{"id":7438,"url":"https:\/\/beatsoop.com\/index.php\/home\/home-example-seven\/","url_meta":{"origin":884,"position":0},"title":"Home (Example Seven)","author":"beatsoop.com","date":"9 March 2013","format":false,"excerpt":"[impact_text include_button=\"yes\" button_style=\"standard\" title=\"Buy now\" href=\"\/features\/\" color=\"accent\" size=\"normal\" type=\"roundedarrow\" target=\"_self\" position=\"cta_align_right\" alt_background=\"alt-seven\" el_class=\"mb0 mt0 bt0\" width=\"1\/1\" el_position=\"first last\"] Neighborhood: A clean, responsive & retina-ready multipurpose eCommerce WordPress theme. [\/impact_text] [blank_spacer height=\"60px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block title=\"Incredibly Responsive\" icon=\"fa-mobile-phone\" pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/4\" el_position=\"first\"] Neighborhood is completely responsive. And when we say\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":7441,"url":"https:\/\/beatsoop.com\/index.php\/home\/home-example-five\/","url_meta":{"origin":884,"position":1},"title":"Home (Example Five)","author":"beatsoop.com","date":"9 March 2013","format":false,"excerpt":"[blank_spacer height=\"40px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/4\" el_position=\"first\"] Incredibly Responsive Neighborhood is completely responsive. And when we say responsive, we mean it won\u2019t only work on mobile devices; it\u2019ll look damn good! Find out more > [\/spb_text_block] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/4\"] Swift Page Builder Quickly & easily create\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":12093,"url":"https:\/\/beatsoop.com\/index.php\/home\/home-example-eight\/","url_meta":{"origin":884,"position":2},"title":"Home (Example Eight)","author":"beatsoop.com","date":"22 January 2013","format":false,"excerpt":"[impact_text include_button=\"yes\" button_style=\"standard\" title=\"Take the tour\" href=\"\/features\/\" color=\"accent\" size=\"normal\" type=\"roundedarrow\" target=\"_self\" position=\"cta_align_right\" alt_background=\"alt-five\" el_class=\"mb0 mt0 bt0 bb0\" width=\"1\/1\" el_position=\"first last\"] Neighborhood: A clean, responsive & retina-ready multipurpose eCommerce WordPress theme. [\/impact_text] [blank_spacer height=\"60px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/4\" el_position=\"first\"] Incredibly Responsive Neighborhood is completely responsive. And when we\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1333,"url":"https:\/\/beatsoop.com\/index.php\/pages\/meet-the-team\/","url_meta":{"origin":884,"position":3},"title":"Meet the team","author":"beatsoop.com","date":"13 August 2012","format":false,"excerpt":"[team item_count=\"4\" category=\"all\" social_icon_type=\"dark\" profile_link=\"yes\" pagination=\"yes\" el_class=\"pb0 mb0\" width=\"1\/1\" el_position=\"first last\"] [impact_text include_button=\"yes\" button_style=\"standard\" title=\"Browse work\" href=\"http:\/\/neighborhood.swiftideas.net\/portfolio-one-column-standard-style\/\" color=\"accent\" size=\"standard\" type=\"roundedarrow\" target=\"_self\" position=\"cta_align_right\" alt_background=\"alt-one\" el_class=\"mt0 no-arrow\" width=\"1\/1\" el_position=\"first last\"] Our team works hard to create amazing things, check them out. [\/impact_text] [blank_spacer height=\"30px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/1\" el_position=\"first\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"ff_team4_retina_bw","src":"https:\/\/i0.wp.com\/neighborhood.swiftideas.net\/wp-content\/uploads\/2013\/03\/ff_team4_retina_bw.jpg?resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/neighborhood.swiftideas.net\/wp-content\/uploads\/2013\/03\/ff_team4_retina_bw.jpg?resize=350%2C200 1x, https:\/\/i0.wp.com\/neighborhood.swiftideas.net\/wp-content\/uploads\/2013\/03\/ff_team4_retina_bw.jpg?resize=525%2C300 1.5x"},"classes":[]},{"id":2935,"url":"https:\/\/beatsoop.com\/index.php\/shortcodes\/icons-links-with-icons\/","url_meta":{"origin":884,"position":4},"title":"Icons & Links with icons","author":"beatsoop.com","date":"17 November 2012","format":false,"excerpt":"[spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/1\" el_position=\"first last\"] Small Icons [\/spb_text_block] [blank_spacer height=\"3px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/4\" el_position=\"first\"] [\/spb_text_block] [codesnippet pb_margin_bottom=\"no\" width=\"3\/4\" el_position=\"last\"] [icon image=\"flask\" size=\"small\" cont=\"yes\/no\"] [\/codesnippet] [blank_spacer height=\"30px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/1\" el_position=\"first last\"] Medium Icons [\/spb_text_block] [blank_spacer height=\"3px\" width=\"1\/1\" el_position=\"first last\"] [spb_text_block pb_margin_bottom=\"no\"\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":6184,"url":"https:\/\/beatsoop.com\/index.php\/shortcodes\/charts-progress-bars\/","url_meta":{"origin":884,"position":5},"title":"Swift Charts & Progress Bars","author":"beatsoop.com","date":"27 February 2013","format":false,"excerpt":"[spb_text_block title=\"Charts - Large\" pb_margin_bottom=\"no\" pb_border_bottom=\"no\" width=\"1\/1\" el_position=\"first last\"] [\/spb_text_block] [codesnippet pb_margin_bottom=\"yes\" width=\"1\/4\" el_position=\"first\"] [chart percentage='80' size='170' barcolour='#1bbeb4' trackcolour='#baebe8' content='fa-bar-chart-o' align='left'] [\/codesnippet] [codesnippet pb_margin_bottom=\"yes\" width=\"1\/4\"] [chart percentage='70' size='170' barcolour='#1bbeb4' trackcolour='#baebe8' content='70%' align='left'] [\/codesnippet] [codesnippet pb_margin_bottom=\"yes\" width=\"1\/4\"] [chart percentage='60' size='170' barcolour='#1bbeb4' trackcolour='#baebe8' content='6\/10' align='left'] [\/codesnippet] [codesnippet pb_margin_bottom=\"yes\" width=\"1\/4\" el_position=\"last\"] [chart percentage='100'\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/pages\/884"}],"collection":[{"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/comments?post=884"}],"version-history":[{"count":1,"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/pages\/884\/revisions"}],"predecessor-version":[{"id":12294,"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/pages\/884\/revisions\/12294"}],"up":[{"embeddable":true,"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/pages\/8303"}],"wp:attachment":[{"href":"https:\/\/beatsoop.com\/index.php\/wp-json\/wp\/v2\/media?parent=884"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}