Style Last Topics and Login Widgets how to

User avatar
axew3
w3all User
w3all User
Posts: 1409
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Style Last Topics and Login Widgets how to

Post by axew3 » Thu Jun 22, 2017 8:50 pm

This first explain post if for more advanced users, skip to next reply post for the easy how to style widgets
Check also the latest post on this topic!

If you need to style widgets because they do not look like your theme

For Widget Last Topics
open file
views/phpbb_last_topics.php
+- on top search for this lines:

Code: Select all

$w3all_lastopics_style_ul = 'list-style:none;margin:0px';
$w3all_lastopics_style_ul_class = 'w3all_ul_widgetLastTopics'; // declare this class .w3all_ul_widgetLastTopics into your css template and style ul element as needed 
$w3all_lastopics_style_li_class = 'w3all_li_widgetLastTopics'; // declare this class .w3all_li_widgetLastTopics into your css template and style li elements as needed 
WP_w3all Login Widget
files
views/login_form_include_iframe_mode_links.php
and
views/login_form_include_noiframe_mode_links.php

Code: Select all

$w3all_loginform_style_ul = 'list-style:none;margin:0px';
$w3all_loginform_style_ul_class = 'w3all_ul_widgetLogin'; // declare this class .w3all_ul_widgetLogin into your css template and style ul element as needed 
$w3all_loginform_style_li_class = 'w3all_li_widgetLogin'; // declare this class .w3all_li_widgetLogin into your css template and style li elements as needed 
 
Be noticed that if you change classes names, when the plugin will be updated (so all plugin's files replaced by the update) you'll need so to reset classes names other time on views/phpbb_last_topics.php or views/login_form_include_iframe_mode_links.php or views/login_form_include_noiframe_mode_links.php

User avatar
axew3
w3all User
w3all User
Posts: 1409
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: Style Last Topics and Login Widgets how to

Post by axew3 » Fri Aug 04, 2017 8:44 pm

As easy start example that you'll customize adding your CSS code, to style the two widgets, is necessary to add the follow into your childtheme CSS or main CSS of your WP theme, in this way:

to style UL and LI elements for widget Last Topics

Code: Select all

.w3all_ul_widgetLastTopics {
padding: 10px;
/* edit or/and add more styles */
}
.w3all_li_widgetLastTopics {
padding: 3px 0px;
/* edit or/and add more styles */
}
to style UL and LI elements for widget Login

Code: Select all

.w3all_ul_widgetLogin {
padding: 10px;
/* edit or/and add more styles */
}
.w3all_li_widgetLogin {
padding: 3px 0px;
/* edit or/and add more styles */
}

User avatar
axew3
w3all User
w3all User
Posts: 1409
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Style widgets/shortcodes and do not lose changes on plugin update

Post by axew3 » Tue Apr 17, 2018 6:18 pm

... do not lose changes on plugin update.
To style your widgets and shortcodes to look like your theme, you may wish to edit files that output the html code: you can check for all these files into folder
/wp-content/plugins/wp-w3all-phpbb-integration/views
they are quite self explained on their names:

phpbb_last_topics.php (output last topics on widgets)
phpbb_last_topics_output_shortcode.php (output last topics shortcode)
phpbb_last_topics_forums_ids_shortcode.php (output last topics shortcode by forums IDS)
login_form_include_noiframe_mode_links.php (output login form widget when links are not set to point to iframed page)
login_form_include_iframe_mode_links.php (output login form widget when links are set to point to iframed page)

if you go to edit these files and you do not want they are overwritten on plugin update, then you
can copy/paste these five files into the custom folder you'll go to create
/wp-content/plugins/wp-w3all-config
or that you may have manually create already, if you had chosen to include/use the custom phpBB config.php file.
If not, create it and to activate the use of these files, activate the related option into
WP_w3all admin config page -> Use custom files to display Last Topics Widgets, Login Widget or Last Topics Shortcode content

custom modifications done into these files, aren't overwritten when plugin update.

NOTE IMPORTANT:
if you activate this option, it is mandatory that you copy/paste all these five (5) listed files into the custom folder
/wp-content/plugins/wp-w3all-config

Post Reply