web analytics

WordPress Divi Theme Fullwidth Section and Fullwidth Slider Mobile View Font Size

[et_pb_section bb_built=”1″ next_background_color=”#000000″][et_pb_row][et_pb_column type=”4_4″][et_pb_text admin_label=”Text – Introduction” _builder_version=”3.19.3″]

This document and associated video describe a user interface issue with how the the WordPress Divi theme presents font size options for the Fullwidth Slider Title Text. To reproduce the issue, and see how the solution works, follow these steps which are also shown in the video below.

  1. Create a fullwidth section.
  2. Add a fullwidth slider.
  3. Create a single slide with Heading text but no button text and no content.
  4. Go to the Design tab and scroll down to find the Title Text and Body Text areas.
  5. Notice that the Title Text Size slider does not have tabs for Desktop, Tablet, Mobile.
  6. Adjust the slider. Then a smartphone icon appears to the right of the slider. Click on that. Then the desktop, tablet, and smartphone tabs appear letting you adjust different font sizes for these different devices.

 

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”off” specialty=”off” prev_background_color=”#000000″ next_background_color=”#000000″][et_pb_row][et_pb_column type=”4_4″][et_pb_text admin_label=”Text – Fullwidth Slider with Default Settings and Dark Text” _builder_version=”3.19.3″]

Fullwidth Slider with Default Settings and Dark Text

Below is a Fullwidth Slider Module with default settings and dark text.

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”on” specialty=”off” prev_background_color=”#000000″ next_background_color=”#000000″ _builder_version=”3.19.3″][et_pb_fullwidth_slider admin_label=”Fullwidth Slider – Default Settings” _builder_version=”3.19.3″][et_pb_slide _builder_version=”3.19.3″ heading=”Mississippi and other enormous words don’t fit on mobile devices with the default slider settings. (Default Settings)” button_link=”#” url_new_window=”off” link_option_url_new_window=”off” background_color=”#7EBEC5″ use_background_color_gradient=”off” background_color_gradient_start=”#2b87da” background_color_gradient_end=”#29c4a9″ background_color_gradient_type=”linear” background_color_gradient_direction=”180deg” background_color_gradient_direction_radial=”center” background_color_gradient_start_position=”0%” background_color_gradient_end_position=”100%” background_color_gradient_overlays_image=”off” background_image=”https://resourcesforlife.com/wp-content/uploads/2018/12/20181231mo1742-wordpress-gutenberg-mountain.jpg” parallax=”on” parallax_method=”on” background_size=”cover” background_position=”center” background_repeat=”no-repeat” background_blend=”normal” allow_player_pause=”off” background_video_pause_outside_viewport=”on” use_bg_overlay=”off” use_text_overlay=”off” text_border_radius=”3″ alignment=”center” child_filter_hue_rotate=”0deg” child_filter_saturate=”100%” child_filter_brightness=”100%” child_filter_contrast=”100%” child_filter_invert=”0%” child_filter_sepia=”0%” child_filter_opacity=”100%” child_filter_blur=”0px” child_mix_blend_mode=”normal” background_layout=”light” text_shadow_style=”none” header_font_size_last_edited=”off|desktop” header_text_shadow_style=”none” body_text_shadow_style=”none” custom_button=”off” button_bg_use_color_gradient=”off” button_bg_color_gradient_overlays_image=”off” button_use_icon=”on” button_on_hover=”on” button_text_shadow_style=”none” box_shadow_style_button=”none” hover_transition_duration=”300ms” hover_transition_delay=”0ms” hover_transition_speed_curve=”ease” text_shadow_horizontal_length=”0em” text_shadow_vertical_length=”0em” text_shadow_blur_strength=”0em” header_text_shadow_horizontal_length=”0em” header_text_shadow_vertical_length=”0em” header_text_shadow_blur_strength=”0em” body_text_shadow_horizontal_length=”0em” body_text_shadow_vertical_length=”0em” body_text_shadow_blur_strength=”0em” button_text_shadow_horizontal_length=”0em” button_text_shadow_vertical_length=”0em” button_text_shadow_blur_strength=”0em” header_font=”||||||||” header_font_size=”56″ header_font_size_tablet=”56″ header_font_size_phone=”56″ /][/et_pb_fullwidth_slider][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”off” specialty=”off” prev_background_color=”#000000″ next_background_color=”#000000″][et_pb_row][et_pb_column type=”4_4″][et_pb_text admin_label=”Text – Fullwidth Slider with Custom Settings and Dark Text” _builder_version=”3.19.3″]

Fullwidth Slider with Custom Settings and Dark Text

Below is a Fullwidth Slider with custom settings for mobile font size and dark text.

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”on” specialty=”off” prev_background_color=”#000000″ next_background_color=”#000000″][et_pb_fullwidth_slider admin_label=”Fullwidth Slider – Custom Settings” _builder_version=”3.19.3″][et_pb_slide _builder_version=”3.19.3″ heading=”Mississippi and other enormous words don’t fit on mobile devices with the default slider settings. (Custom Settings)” button_link=”#” url_new_window=”off” link_option_url_new_window=”off” background_color=”#7EBEC5″ use_background_color_gradient=”off” background_color_gradient_start=”#2b87da” background_color_gradient_end=”#29c4a9″ background_color_gradient_type=”linear” background_color_gradient_direction=”180deg” background_color_gradient_direction_radial=”center” background_color_gradient_start_position=”0%” background_color_gradient_end_position=”100%” background_color_gradient_overlays_image=”off” background_image=”https://resourcesforlife.com/wp-content/uploads/2018/12/20181231mo1742-wordpress-gutenberg-mountain.jpg” parallax=”on” parallax_method=”on” background_size=”cover” background_position=”center” background_repeat=”no-repeat” background_blend=”normal” allow_player_pause=”off” background_video_pause_outside_viewport=”on” use_bg_overlay=”off” use_text_overlay=”off” text_border_radius=”3″ alignment=”center” child_filter_hue_rotate=”0deg” child_filter_saturate=”100%” child_filter_brightness=”100%” child_filter_contrast=”100%” child_filter_invert=”0%” child_filter_sepia=”0%” child_filter_opacity=”100%” child_filter_blur=”0px” child_mix_blend_mode=”normal” background_layout=”light” text_shadow_style=”none” header_font_size_last_edited=”on|phone” header_text_shadow_style=”none” body_text_shadow_style=”none” custom_button=”off” button_bg_use_color_gradient=”off” button_bg_color_gradient_overlays_image=”off” button_use_icon=”on” button_on_hover=”on” button_text_shadow_style=”none” box_shadow_style_button=”none” hover_transition_duration=”300ms” hover_transition_delay=”0ms” hover_transition_speed_curve=”ease” header_font_size=”56″ header_font_size_tablet=”56″ header_font_size_phone=”38″ text_shadow_horizontal_length=”0em” text_shadow_vertical_length=”0em” text_shadow_blur_strength=”0em” header_text_shadow_horizontal_length=”0em” header_text_shadow_vertical_length=”0em” header_text_shadow_blur_strength=”0em” body_text_shadow_horizontal_length=”0em” body_text_shadow_vertical_length=”0em” body_text_shadow_blur_strength=”0em” button_text_shadow_horizontal_length=”0em” button_text_shadow_vertical_length=”0em” button_text_shadow_blur_strength=”0em” header_font=”|800|||||||” /][/et_pb_fullwidth_slider][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”off” specialty=”off” prev_background_color=”#000000″][et_pb_row][et_pb_column type=”4_4″][et_pb_text admin_label=”Text – Video” _builder_version=”3.19.3″]

Video

Here’s a video showing what’s described above.

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]

By Greg Johnson

Greg Johnson is a freelance writer and tech consultant in Iowa City. He is also the founder and Director of the ResourcesForLife.com website. Learn more at AboutGregJohnson.com

Leave a Reply