How to Design a Divi Timeline Layout with Scroll Effects

How to Design a Divi Timeline Layout with Scroll Effects

Elegant Themes

3 года назад

21,943 Просмотров

Ссылки и html тэги не поддерживаются


Комментарии:

Sebastian Blomeier
Sebastian Blomeier - 13.06.2023 00:03

I don't have the start and position option. How do I proceed?

Ответить
Henry Robusto
Henry Robusto - 30.04.2023 04:20

How to make 4 or 6 blurbs???????????

Ответить
Mir Sabir Ali Khan
Mir Sabir Ali Khan - 03.02.2023 18:19

how can i make circles to be working for more than 3 points?

Ответить
Katharina Altmann
Katharina Altmann - 02.11.2022 00:31

Hi, I used your template because this tutorial wasnt complete, but now I'm struggling to change the color of the red dot.
Can you send me the CSS to change the color of the red scrolling dot. It seems to be impossible.
I'd appreciate it.

Ответить
Kelman Castillo
Kelman Castillo - 24.07.2022 00:02

I was ripped off by this guy MAK big time.
Don't believe anything he says you'd receive if you buy Divi with his affiliate link. I wish I had done it through someone else.
I even tried to escalate it through his website and emailed him but got no response. You're better off buying Divi with any other affiliate link but his.

Ответить
sunny nuri
sunny nuri - 05.03.2022 14:48

How did he Middle aligned everything??

Ответить
Igor Gasperec
Igor Gasperec - 05.03.2022 01:40

Don't waste your time guys on this. No offence , the end version looks superb but when editing this video you must have skipped something. I followed everything exactly as you said and my page is far from your end result :D I'll try to follow the version from the link again and find the bugs will update if finish successfully.

Ответить
Sebastián Jara
Sebastián Jara - 12.02.2022 03:16

no me funciono

Ответить
Pieter
Pieter - 22.11.2021 13:21

Mann, I want to build something similar, but this does not guide me in how this works in any way. Like what do those scroll numbers even mean in relation to the position of the screen lol. It's also not clearly explained anywhere. It's real hard to replicate anything in htis video, impossible atually. You just got these numbers through trail and error?

Ответить
ikmat ul rabib
ikmat ul rabib - 21.10.2021 22:27

if you can't end a tutorial properly, just don't publish them like this. it was a good start but the end is terrible. it would be better if you guys put the blog link and tell us to learn from that. it just wasted my time.

and, in this video many things left unexplained, skipped. first video from elegant theme that got dislike from me.
if you guys recreate this tutorial properly, only then i will give a like.

Ответить
Brendon Connett
Brendon Connett - 18.09.2021 03:49

Really good start to the tutorial. It is sad to see that this video was edited and uploaded with a good 20% of the tutorial missing. From what I understand about the Elegant Themes channel, you guys are for beginners and advanced. You guys explain stuff quite well (better than most), but this is not the quality that I thought I would get with such a good builder.

Ответить
Indigo Varela
Indigo Varela - 22.07.2021 01:34

Howwww did this video get published? Amazing to me that you guys would just edit the end of the video to show the final version. Definitely the worst video I've seen published by elegant themes. IF YOU READ THIS COMMENT FIRST, DO NOT FOLLOW THE VIDEO!

Ответить
Andy O'shaughnessy
Andy O'shaughnessy - 12.05.2021 15:18

I love your energy.

Ответить
Hello
Hello - 20.03.2021 19:49

If you habe the problem that it is on the left side just change the Section padding (left)

Ответить
Daniel Pichler
Daniel Pichler - 10.03.2021 22:12

DO NOT TRY THIS!!! I recreated everything exactly. Unfortunately everything "got stuck" on the left side. Could save something - I used 2 columns. Unfortunately not suitable for the smartphone version.

Ответить
Sara DeVere
Sara DeVere - 02.12.2020 23:56

EDIT:

Found the solution to issue #2 in the comment section under the blog post.
"This is because the “rtl” css direction is only meant for languages that read right to left. To fix it, you can wrap the text in the blurb body content box with a div like this:

<div dir="ltr">Your Blurb Body Text.</div>
"

Original Comment:

I'm so disappointed in this tutorial.

Firstly, it's like the end of the tutorial got cut out. Several steps were missing between where he says to save the page and previews the page. Mine matched his, everything still aligned on the left, the middle blurb all stretched out and flipped, but then everything was magically fixed on his example when he previewed. Mine was not. I ended up downloading the JSON file from the blog post and modifying it from there.

Secondly, the custom CSS used in the alternating blurbs (direction: rtl) makes the blurb icon appear on the right (good) but also reverses the way the text appears causing any punctuation at the end of the blurb to show on THE LEFT SIDE OF THE LAST SENTENCE (very bad!). Like this ".This is my ending statement" You can see it in Mak's example as well as in the blog post.

When I reached out to support to see if there was a solution, they simply said "I am afraid, it requires some serious amount of customization to change the whole layout of this timeline as changing the blurb position will require to re-design most part of the layout as this is something which is coming from our timeline layout and outside the scope of support that we could provide here."

Don't waste an afternoon as I did. Or, don't use punctuation and produce an unfinished looking product. So very disappointed.

Ответить
Erwin Rodriguez
Erwin Rodriguez - 25.09.2020 05:16

Hey Man Awesome, I loved it! thanks for the tutorial. Don't sweat it because people don't know any html & css lol. I liked this one!

Ответить