Framework
Global Presets UI Style Guide
01. Color palette
In this part of the style guide, you can modify each color inside the Text Module’s background settings. Use that same color code inside the Text Module below it to have a written version of the color code too. Use these color codes inside your Divi Theme Builder default color palette afterward.
#42849b
#9992bb
#cba93a
#872f41
#ff6633
#cc0099
#4d2026
#BEBD3D
#61655D
#4c4c4c
#C6C6C6
#F9F9F9
#e0e0e0
#444444
#000000
02. Text styles
In the second part of this style guide wireframe, you can style your different text types. You’re also provided with a primary, secondary and tertiary option, each of which you can afterwards turn into individual presets.
H2 Roze 1.5em
H3 Roze 1.3em
H4 Roze kop 1.2em
H2 border oranje 1.5em
H3 border oranje 1.3em
H4 border oranje 1.2em
Heading 1
Heading 1
Heading 1
Heading 1
Heading 2
Heading 2 oranje 21 px
Heading 2
Heading 3
Heading 3
Heading 3
Heading 3
Heading 4
Heading 4
Heading 4
Heading 4
Body
Yanone Coffesatz H2
Titel 2.2em
Rand om de tekst module padding 8%
Border 1px #ededed Ronding 5px
Yanone Coffesatz H2
Titel 2.2em
Rand om de tekst module 8% padding
#ededed Ronding 5px | Schaduw
Yanone Coffesatz H2
Titel 2.2em
Rand om de tekst module 8% padding
#ededed Ronding 5px | Schaduw
Body
Row setting
Equalize column height
H4 Roze kop 1.2em
Rode tekst onder H4 Roze kop
Tekstkleur donkerrood #4d2026
H4 Roze kop 1.2em
Tekst onder H4 Roze kop
Met tekstkleur standaard
H3 Roze 1.3em
Achtergrond transparant
rgba(255,255,255,0.85)
In de 2e kolom van de rij
Spacing 9px
H3 Roze 1.3em
Achtergrond transparant
rgba(255,255,255,0.64)
In de 2e kolom van de rij
Koptekst H2 1.5em
Yanone Kaffeesatz 2vw
De hele rij kopieeren
List
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
- Lorum Ipsum
All in one
Heading 1 | 3em
Heading 2 | 2.2em
Heading 3 | 1.8em
Heading 4 | 1.5em
Lorum ipsum dolor sit amet.
- Lorum Ipsum
H2 work sans
WORK SANS 16px
The last part of this style guide handles some of the most-used modules inside Divi.
Rechter kolom heeft een border van 1 px aan de linkerkant.
Button
Blurb
Eerste item
Curabitur aliquet
Quisque velit nisi, pretium ut lacinia in, elementum id enim. Nulla porttitor accumsan tincidunt. Curabitur aliquet quam id dui posuere blandit. Nulla porttitor accumsan
Deze is 't beste
height: 300px; width: 300px;
border-radius: 100%;
padding: 5% !important;
display: flex;
Appelman Vegetables BV
Noordervaart 32
1841 HA Stompetoren
20 wekenecho
Echo placenta lokalisatie
Deze echo wordt gemaakt als bij de 20 weken echo blijkt dat je placenta te dicht bij je baarmoedermond ligt of zelfs ervoor. Dat kan lastig zijn bij de bevalling. Deze echo wordt gemaakt
vanaf de 30e week van je zwangerschap
Groeiecho
Bij deze echo controleren we of je baby goed groeit. We kijken we naar de grootte van het kind, meten het vruchtwater, het hoofdje, de buik en het bovenbeen van je kindje. Deze echo vindt meestal plaats tussen de 26 en 34 weken zwangerschap.
Voldoende afstand houden
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Kinderen mogen mee naar binnen of niet
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
We schudden geen handen
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Hoest en nies in de binnenkant van uw elleboog
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
U mag uw partner meenemen bij de 20 wekenecho
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Bij aankomst handen desinfecteren
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Je vraag of opmerking
Image
Call to action
Your Title Goes Here
display:flex;
align-items: center;
CSS to the Promo Description:
padding-bottom: 0px
Your Title Goes Here
Ruimte voor Tekst
Divider
Person
Name Goes Here
Position
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Name Goes Here
Position
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Social Media Follow
Toggle
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your Title Goes Here
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Testimonial
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
Wat zijn medische echo's?
Hoe lang duurt een medische echo?
Kan je zelf kiezen waar je de medische 13 weken of 20 weken echo laat maken?
Kunnen te veel echo's kwaad?
Ondanks vele jaren van medisch wetenschappelijk onderzoek zijn, tot op heden, geen nadelige gevolgen voor moeder en ongeboren kind bekend door het gebruik van echografische apparatuur met betrekking tot de zwangerschap. Alle echoapparaten beschikken over zogeheten ‘veiligheidsmarges’. Deze veiligheidsmarges zorgen ervoor dat er in principe geen schade wordt toegebracht aan moeder en het kindje.
Welke echo's worden vergoed door je zorgverzekering
Bron: Zorgwijzer.nl
Bij een zwangerschap is het raadzaam om goed naar de dekking van de zorgverzekering te kijken. Veel wordt gedekt door de basisverzekering, maar soms maak je toch kosten, bijvoorbeeld omdat je gebruik maakt van zorg die niet (volledig) in het basispakket is opgenomen. Een aanvullende verzekering kan dan een handige optie zijn.
Tijdens de zwangerschap zal er minimaal twee keer een echo worden gemaakt. Bij de eerste, algemene termijnecho (na 12 weken) wordt bepaald wanneer je ongeveer bent uitgerekend. Tevens wordt de ligging van de baby bepaald.
ECHO’s
Na 20 weken volgt standaard een tweede echo, het structureel echoscopisch onderzoek (SEO). Deze twee echo’s vallen onder de dekking van het basispakket. Daarnaast geldt er een basisdekking voor alle overige echo’s die medisch noodzakelijk zijn.
Aanvullende verzekering
Sommige aanvullende verzekeringen vergoeden ook de 8-weken echo zonder medische indicatie. Informeer hiernaar bij je zorgverzekeraar of raadpleeg een zorgvergelijker.
Lukt een echo altijd?
Apart toepassen bij OF pagina’s OF posts
Samen gebruiken geeft ongewenst resultaat ivm het Quote teken dat bij Posts op een verkeerde plek terechtkomt of bij Pagina’s op de verkeerde plek staatBij een pagina
Voeg de CLASS my-spacing
toe in de tekstwidget/* Sets margins and other styling for blockquote */
.my-spacing blockquote {
padding-bottom: 1.2em;
padding-top: 1em;
padding-left: 5em;
margin-top: 3em;
}blockquote::before {
content: “\201C”;
font-family: Georgia,serif;
font-size: 6em;
font-weight: bold;
color: #999;
position: absolute;
left: 30px;
top: 0px;
}Bij een POST (inclusief schaduw
/* Sets margins and other styling for blockquote */
blockquote {
padding-bottom: 1.2em;
padding-top: 0em;
padding-left: 3em;
margin-top: 2em;
padding-right: 5%!important;
box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 30%);
}blockquote::before {
content: “\201C”;
font-family: Georgia,serif;
font-size: 4em;
font-weight: bold;
color: #999;
position: relative;
left: 0px;
top:0px}
Achterzijde met tekst
” use_back_button=”on” back_button_text=”Lees verder” use_force_square=”on” front_side_bg_color=”#FFFFFF” back_side_bg_color=”#FF6633″ _builder_version=”4.15.1″ _module_preset=”default” front_desc_font=”Actor|600||on|||||” back_desc_text_color=”#FFFFFF” custom_back_button=”on” back_button_text_size=”14px” back_button_text_color=”#4D2026″ back_button_bg_color=”#FFFFFF” back_button_border_width=”1px” back_button_border_color=”#efefef” back_button_use_icon=”off” back_button_custom_padding=”|||||true” custom_margin=”||-284px|||” border_radii=”on|50%|50%|50%|50%” border_color_all_back_image=”#FFFFFF” box_shadow_style=”preset1″ locked=”off” global_colors_info=”{}” _i=”0″ _address=”5.1.0.0″ theme_builder_area=”post_content” /][dmpro_flip_box use_front_icon=”on” front_icon=”H||divi||400″ front_icon_color=”#9992BB” front_content=”
Tweede item
” back_content=”
Achterzijde met tekst
” use_back_button=”on” back_button_text=”Lees verder” use_3d_effect=”on” front_side_bg_color=”#FFFFFF” back_side_bg_color=”#FF6633″ _builder_version=”4.15.1″ _module_preset=”default” front_desc_font=”Actor|600||on|||||” back_desc_text_color=”#FFFFFF” custom_back_button=”on” back_button_text_size=”14px” back_button_text_color=”#4D2026″ back_button_bg_color=”#FFFFFF” back_button_border_width=”1px” back_button_border_color=”#efefef” back_button_use_icon=”off” back_button_custom_padding=”|||||true” border_radii=”on|50%|50%|50%|50%” border_color_all_back_image=”#FFFFFF” box_shadow_style=”preset1″ locked=”off” global_colors_info=”{}” _i=”1″ _address=”5.1.0.1″ theme_builder_area=”post_content” /]
3D content effect
” back_title=”Achterzijde” back_content=”
En dit is de dummy tekst voor de achterkant
” flip_box_height=”254px” use_3d_effect=”on” back_side_bg_color=”rgba(15,7,6,0.43)” front_side_bg_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” back_side_bg_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” back_side_bg_blend=”multiply” _builder_version=”4.15.1″ _module_preset=”default” front_title_text_color=”#FFFFFF” front_desc_text_color=”#FFFFFF” back_title_text_color=”#FFFFFF” back_desc_text_color=”#FFFFFF” custom_padding=”|2vw||2vw|false|true” border_radii=”on|20px|20px|20px|20px” box_shadow_style=”preset1″ global_colors_info=”{}” _i=”0″ _address=”5.1.1.0″ theme_builder_area=”post_content” /]
3D content effect
” back_title=”Achterzijde” back_content=”
En dit is de dummy tekst voor de achterkant
” flip_box_height=”254px” flip_box_animation=”flip_vertically_btt” use_3d_effect=”on” back_side_bg_color=”rgba(15,7,6,0.43)” front_side_bg_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” back_side_bg_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” back_side_bg_blend=”multiply” _builder_version=”4.15.1″ _module_preset=”default” front_title_text_color=”#FFFFFF” front_desc_text_color=”#FFFFFF” back_title_text_color=”#FFFFFF” back_desc_text_color=”#FFFFFF” custom_padding=”|2vw||2vw|false|true” border_radii=”on|20px|20px|20px|20px” box_shadow_style=”preset1″ global_colors_info=”{}” _i=”0″ _address=”5.1.2.0″ theme_builder_area=”post_content” /]
Daar bovenop een Gradient filter” use_content_hover_button=”on” content_hover_button_text=”Lees verder” hover_box_align_front=”top_left” hover_box_align_back=”top_left” content_hover_bg_color_gradient_overlays_image=”on” _builder_version=”4.16.0″ _module_preset=”default” content_title_text_color=”#FFFFFF” content_hover_title_text_color=”#FFFFFF” content_hover_desc_text_color=”#FFFFFF” background_enable_color=”off” use_background_color_gradient=”on” background_color_gradient_stops=”rgba(0,0,0,0.63) 0%|rgba(0,0,0,0.07) 99%” background_color_gradient_overlays_image=”on” background_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” custom_content_hover_button=”on” content_hover_button_text_size=”16px” content_hover_button_text_color=”#FFFFFF” content_hover_button_bg_color=”rgba(10,10,10,0.64)” content_hover_button_border_width=”1px” content_hover_button_border_color=”#FFFFFF” content_hover_button_icon=”9||divi||400″ content_hover_button_custom_margin=”||||false|true” content_hover_button_custom_padding=”|2vw||2vw|false|true” custom_padding=”1vw|1vw||1vw|false|true” link_option_url=”#” border_radii=”on|10px|10px|10px|10px” content_hover_button_text_shadow_style=”preset1″ global_colors_info=”{}” background__hover_enabled=”on|hover” use_background_color_gradient__hover=”on” background_color_gradient_overlays_image__hover=”on” background_color_gradient_stops__hover=”rgba(0,0,0,0.48) 0px|rgba(0,0,0,0.65) 98px” _i=”0″ _address=”5.2.0.0″ theme_builder_area=”post_content” /]
Daar bovenop een Gradient filter” use_content_hover_button=”on” content_hover_button_text=”Lees verder” hover_box_align_front=”top_left” hover_box_align_back=”top_left” content_hover_bg_color_gradient_overlays_image=”on” _builder_version=”4.16.0″ _module_preset=”default” content_title_text_color=”#FFFFFF” content_hover_title_text_color=”#FFFFFF” content_hover_desc_text_color=”#FFFFFF” background_enable_color=”off” use_background_color_gradient=”on” background_color_gradient_direction=”89deg” background_color_gradient_stops=”rgba(0,0,0,0.8) 0%|rgba(0,0,0,0) 99%” background_color_gradient_overlays_image=”on” background_image=”https://landbouwdagalkmaar.nl/wp-content/uploads/2022/04/fishing-boats-6919341_1280.jpg” custom_content_hover_button=”on” content_hover_button_text_size=”16px” content_hover_button_text_color=”#FFFFFF” content_hover_button_bg_color=”rgba(10,10,10,0.64)” content_hover_button_border_width=”1px” content_hover_button_border_color=”#FFFFFF” content_hover_button_icon=”9||divi||400″ content_hover_button_custom_margin=”||||false|true” content_hover_button_custom_padding=”|2vw||2vw|false|true” custom_padding=”1vw|7vw|||false|false” link_option_url=”#” border_radii=”on|10px|10px|10px|10px” content_hover_button_text_shadow_style=”preset1″ global_colors_info=”{}” background__hover_enabled=”on|hover” use_background_color_gradient__hover=”on” background_color_gradient_overlays_image__hover=”on” background_color_gradient_stops__hover=”rgba(0,0,0,0.72) 0%|rgba(0,0,0,0) 99%” _i=”0″ _address=”5.2.2.0″ theme_builder_area=”post_content” /]