Wrap it Up - Know the Code

Skip to episode playlist

WooHoo! You made through this lab. Congratulations! I’m proud of you.

Let’s recap what we did in this lab:

We looked at the Beans code that builds the “read more” link.
If you are a Pro member, we looked at various Beans functions and walked through the code.
We talked about various strategies to find the ID and hooks you need to customize your child theme. One hint was to turn on “development mode” as the IDs are then put into the HTML.
We then did a lot of different customizations including:
- We changed the text.
- We got rid of the icon.
- We changed UIKIt’s i tag to a span tag.
- We changed the UIKit icon to a book.
- We added 3 dots after the text.
- We styled it like a button.
- We make a full-width block button.
- We wrapped it in a paragraph.
We dove into UIKIt.
We talked about PHP string processing, DocBlocks, arrays, type hinting, and more.

WooHoo! I just did 9+ customizations for the @BeansPress 'read more' link in this hands-on, guided lab. Share on X

You Rock!

You did it! Excellent job! Bam, you now know how to customize the “read more” link in Beans. WooHoo! Way to go.

Keep It Simple, Stupid (KISS) - the best kiss you'll get in code.

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

Back to the lab's opening page.