Unlock your potential with a Pro Membership
Here is where you propel your career forward. Come join us today. Learn more.
Change the UIKit Icon
Lab: Customizing the “Read More” Link in Beans
Video Runtime: 06:32
In this episode, let’s put the UIKit icon back in, but let’s explore how to change which icon is used. We’ll talk about which filter event name to use as well as explore UIKit icon classes. Let’s add a book icon.
Code Challenge
I’m also challenging you to strip out the text and make the link be a round button. Hint: Look at the UIKit’s Icon Button class attribute.
There’s a time to code and …. yup, that sums it up.
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
