Unlock your potential with a Pro Membership
Here is where you propel your career forward. Come join us today. Learn more.
No More Inline. Put On A New Line
Lab: Customizing the “Read More” Link in Beans
Video Runtime: 01:48
Now that our “read more” link is styled like a button, it makes sense to have it on a separate line. Right? By default an <a> tag is an inline element. How can we make it a block element?
Once upon a time, there was a developer... You! This is going to be a good story...
Episodes
Total Lab Runtime: 02:21:26
- 1 Lab Introductionfree 17:36
- 2 Let's Look at the HTML Markupfree 09:16
- 3 Find Where Beans Renders the "Read More"pro 15:37
- 4 Remove the >> Iconfree 09:46
- 5 Change the "Continue reading" Textfree 08:03
- 6 Append "..." After the Textfree 06:06
- 7 Dive into Bean's beans_output()pro 15:46
- 8 Dive into Beans' beans_open_markup()pro 15:50
- 9 Dive into Beans' beans_close_markup()pro 03:04
- 10 Adding HTML Attributes using beans_add_attributes()pro 09:10
- 11 Style It to Look Like a Buttonfree 04:04
- 12 Add UIKit Button Attributespro 08:16
- 13 No More Inline. Put On A New Linepro 01:48
- 14 Wrap It in a Paragraphpro 05:11
- 15 Change the UIKit Iconpro 06:32
- 16 Wrap it Upfree 05:21
