Categories
Blog

How to change the Pagination text of DIVI’s Filterable Portfolio

[et_pb_section bb_built=”1″ _builder_version=”3.23.3″ background_color=”#fbfcfd” z_index_tablet=”500″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” next_background_color=”#ffffff”][et_pb_row disabled_on=”on|on|” _builder_version=”3.23.3″ min_height=”20px” z_index_tablet=”500″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”][et_pb_column type=”1_2″][et_pb_image src=”https://websiteforjust200.com/wp-content/uploads/2018/09/financeboard.jpg” _builder_version=”3.23.3″ custom_margin=”-5%|||25%” custom_margin_last_edited=”on|” z_index_tablet=”500″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” custom_css_main_element=”-webkit-clip-path: circle(50% at 50% 50%);||clip-path: circle(50% at 50% 50%);||width: 75px;||height: 75px;” /][/et_pb_column][et_pb_column type=”1_2″][et_pb_text _builder_version=”3.23.3″ text_font=”Source Sans Pro||||||||” text_text_align=”left” text_text_color=”rgba(0,0,0,0.8)” text_font_size=”18px” header_font=”||||||||” header_text_align=”left” custom_margin=”-3%|||-65%”]

ErnestPH

[/et_pb_text][et_pb_text _builder_version=”3.23.3″ text_font=”Source Sans Pro||||||||” text_text_align=”left” text_text_color=” rgba(0,0,0,0.44)” header_font=”||||||||” header_text_align=”left” custom_margin=”-5%|||-65%”]

Web developer

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row][et_pb_column type=”4_4″][et_pb_post_title _builder_version=”3.23.3″ text_orientation=”center” text_shadow_horizontal_length=”text_shadow_style,%91object Object%93″ text_shadow_horizontal_length_tablet=”0px” text_shadow_vertical_length=”text_shadow_style,%91object Object%93″ text_shadow_vertical_length_tablet=”0px” text_shadow_blur_strength=”text_shadow_style,%91object Object%93″ text_shadow_blur_strength_tablet=”1px” title_text_shadow_horizontal_length=”title_text_shadow_style,%91object Object%93″ title_text_shadow_horizontal_length_tablet=”0px” title_text_shadow_vertical_length=”title_text_shadow_style,%91object Object%93″ title_text_shadow_vertical_length_tablet=”0px” title_text_shadow_blur_strength=”title_text_shadow_style,%91object Object%93″ title_text_shadow_blur_strength_tablet=”1px” meta_text_shadow_horizontal_length=”meta_text_shadow_style,%91object Object%93″ meta_text_shadow_horizontal_length_tablet=”0px” meta_text_shadow_vertical_length=”meta_text_shadow_style,%91object Object%93″ meta_text_shadow_vertical_length_tablet=”0px” meta_text_shadow_blur_strength=”meta_text_shadow_style,%91object Object%93″ meta_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” z_index_tablet=”500″ title_font=”Source Sans Pro|600||on|||||” title_font_size=”47px” meta=”off” author=”off” date=”off” title_font_size_tablet=”35px” title_font_size_phone=”30px” title_font_size_last_edited=”on|phone” featured_image=”off” /][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”on” specialty=”off” prev_background_color=”#fbfcfd” next_background_color=”#000000″ inner_width=”auto” inner_max_width=”1080px”][et_pb_fullwidth_image _builder_version=”3.24″ src=”https://websiteforjust200.com/wp-content/uploads/2019/06/Screen-Shot-2019-06-08-at-11.06.30-PM.png” box_shadow_blur_tablet=”40px” z_index_tablet=”500″ box_shadow_style=”preset6″ filter_sepia=”20%” /][/et_pb_section][et_pb_section bb_built=”1″ fullwidth=”off” specialty=”off” prev_background_color=”#000000″ inner_width=”auto” inner_max_width=”1080px”][et_pb_row][et_pb_column type=”4_4″][et_pb_code _builder_version=”3.23.3″ z_index_tablet=”500″ saved_tabs=”all”]Home » Blog » How to change the Pagination text of DIVI’s Filterable Portfolio[/et_pb_code][et_pb_text _builder_version=”3.24″ text_font=”Cardo||||||||” text_font_size=”25px” text_font_size_tablet=”19px” text_font_size_phone=”17px” text_font_size_last_edited=”on|phone” text_line_height=”1.8em” text_text_shadow_horizontal_length=”text_text_shadow_style,%91object Object%93″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length=”text_text_shadow_style,%91object Object%93″ text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength=”text_text_shadow_style,%91object Object%93″ text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length=”link_text_shadow_style,%91object Object%93″ link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length=”link_text_shadow_style,%91object Object%93″ link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength=”link_text_shadow_style,%91object Object%93″ link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length=”ul_text_shadow_style,%91object Object%93″ ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length=”ul_text_shadow_style,%91object Object%93″ ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength=”ul_text_shadow_style,%91object Object%93″ ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length=”ol_text_shadow_style,%91object Object%93″ ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length=”ol_text_shadow_style,%91object Object%93″ ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength=”ol_text_shadow_style,%91object Object%93″ ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length=”quote_text_shadow_style,%91object Object%93″ quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length=”quote_text_shadow_style,%91object Object%93″ quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength=”quote_text_shadow_style,%91object Object%93″ quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length=”header_text_shadow_style,%91object Object%93″ header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length=”header_text_shadow_style,%91object Object%93″ header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength=”header_text_shadow_style,%91object Object%93″ header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length=”header_2_text_shadow_style,%91object Object%93″ header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length=”header_2_text_shadow_style,%91object Object%93″ header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength=”header_2_text_shadow_style,%91object Object%93″ header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length=”header_3_text_shadow_style,%91object Object%93″ header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length=”header_3_text_shadow_style,%91object Object%93″ header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength=”header_3_text_shadow_style,%91object Object%93″ header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length=”header_4_text_shadow_style,%91object Object%93″ header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length=”header_4_text_shadow_style,%91object Object%93″ header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength=”header_4_text_shadow_style,%91object Object%93″ header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length=”header_5_text_shadow_style,%91object Object%93″ header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length=”header_5_text_shadow_style,%91object Object%93″ header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength=”header_5_text_shadow_style,%91object Object%93″ header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length=”header_6_text_shadow_style,%91object Object%93″ header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length=”header_6_text_shadow_style,%91object Object%93″ header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength=”header_6_text_shadow_style,%91object Object%93″ header_6_text_shadow_blur_strength_tablet=”1px” max_width=”800px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” z_index_tablet=”500″ header_2_font=”Share Tech||||||||” header_2_font_size=”42px” header_2_font_size_tablet=”34px” header_2_font_size_phone=”29px” header_2_font_size_last_edited=”on|phone” header_2_line_height=”1.2em”]

CSS is the only solution yet

Someone found out that using a Javascript seems to ignore the code when changing the text on Filterable portfolio module. So I tried it myself using the same jQuery code for the Gallery module and just adding the right classes. Indeed it won’t update the texts when saving, though the console log outputted the new text… Also there’s no errors too in the console log, so it’s hard to debug it.

The quick solution is using CSS instead. Shared from Facebook DIVI group. Thanks to moderator, Benny for the codes.

.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-next, 
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-prev {
border:none; /*ignore this because it's my needed styling*/
color: #404148; /*ignore this because it's my needed styling*/
padding: 4px 9px; /*ignore this because it's my needed styling*/
font-size:0; /*THIS IS IMPORTANT set font-size to zero*/ 
}
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-next:after {
content: 'Next Page'; /*add text as you want*/
font-size:16px; /*set your font-size as you want*/
}
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-prev:after {
content: 'Prev Page'; /*add text as you want*/
font-size:16px; /*set your font-size as you want*/
}
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-next:hover, 
.et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.page-prev:hover {
border:0px solid #fff!important; /*ignore this because it's my needed styling*/
}

Do you have a javascript solution? Please share it on the comment below. Thanks!

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

One reply on “How to change the Pagination text of DIVI’s Filterable Portfolio”

Leave a Reply

Your email address will not be published. Required fields are marked *