How to Get Creative with Your Blurb Icon Background in Divi
HTML-код
- Опубликовано: 11 окт 2024
- Blurb modules are some of the most versatile elements you can find in Divi. In this post, we will show you how to go a step further and get creative with the blurb icon background. We will be using a combination of blurb modules, text modules and call to action modules.
These unique designs are perfect for services pages and product category pages. You’ll be able to download the JSON file for free as well!
Read more: www.elegantthe...
VIDEO ERRORS revealed , and my mediocre explanations:
These videos are great at quickly showing what can be done with Divi. I love the volume of content coming out, but to keep them short, sweet, and numerous I'm assuming Elegant doesn't have time to do much editing. Often if you follow the videos exactly you won't get the same end result, because the designer went back and fixed something that didn't make the video narrative.
Chronological order of mistakes I found on this one ( hope it helps others):
2:40 -- The blurb module will seem like it's cutoff. It's basically trapped inside the column. To fix you must go to Column Settings> Advanced>Visibility > Horizontal and Vertical Overflow need to be set to Visible.
8:33 -- I started having major issues with my text module that's rotated to 270 degrees not matching exactly what I was seeing the rest of the way. It was at this point there was a somewhat mysterious directive with no video or explanation to "adjust margins" to bring the text module up in line with the Call To Action. My solution wasn't pretty. I broke almost everything and made my responsiveness very complicated. I played with line height settings, sizing, and spacing across many screen sizes to fix it.
13:30 - 13:40 There's a huge unexplained change to the way the box shadow is rendered. One second it's abruptly cut off by its parent element(Column) , the next second it appears perfect. The solution is the same from the 2:40 mark. You need to adjust Overflow again - Column Settings> Advanced>Visibility > Horizontal and Vertical Overflow need to be set to Visible.
No complaints. Not sure if my solutions are the best. I appreciate all the great content, just trying to help others.
Appreciated man!
Great content just a tab rushed I suppose that is to keep it under 15 minutes but if you notice no people are doing 1hr long videos and we love it. I love the video overall and I wish I could have got my divi using your code. If you have other platforms that offer the same deal let us know
what happened at min 4:05 ? i'never got my blurb outcoming (or being bigger as coming put) as we see it in the tutorial. i did it 3 times... never felt so frustrated since thier videos are alway flawless
same here! Lost so much time thinking I missed something :(((( Until I found the answer in a comment below ... all fixed now
Anybody got instructions on the part he left out regarding the flipped header text on the first design example and how to make it come up to the tear-shaped icon? I used margins as mentioned in the video but that doesn't seem to work. It does something funky with the rest of the elements. There is no way to achieve this first design following this video to be honest.
Go to Text Settings and scroll down to Transform, click the transform translate tab. Adjust the right (Y-axis) top -25 (this determines the positioning).
Abit late response but I stumble at this myself. (You can find out more about the Text setting/Transform in the blogpost: www.elegantthemes.com/blog/divi-resources/how-to-get-creative-with-your-blurb-icon-background-in-divi)
I have done this tutorial several times however I cannot get the Icon part to be bigger than the column part, thus the top part of the icon gets cut by the border of the column part. Any tips of what I could be doing wrong?
You need to set Overflow to visible. Do this in the column Settings, and choose Visibility Tab. Should have been explained around 2:30 - 2:40 timestamp, but was left out.
@@cosgravehill2740 Thank you so much you saved my day
@@cosgravehill2740 i had the same problem and try out 45 minutes to fix it, watch the video in this sequence 7x - there was nothing abbout that step. now i fix it. Thank you to @Tavi Norén to ask that too.
@@marcusmuller1674 hello, how to set it? I go to visability an then?
I normally love Mak's videos, but this one is 100% frustrating as major adjustments were not explained.
Sorry to be so off topic but does anybody know of a method to get back into an instagram account??
I was dumb forgot the account password. I love any help you can offer me.
@Layne Lane instablaster =)
Nice quick toutorial. But what is the different between "vw" and "px" I never see this
Ok. I find it out by myself. It's view port with or vh view port height- great option
my blurb cant show in front of the section
Hello , How to create theme for Real Estate
No more use of px?
Same in this video. i feel like ET or Mak having issues with their stomach. they are in a hurry to go to toilet. this is so much frustrating and waste of time .
i felt that way from the beginning as I had to pause to see what we were going to be building