Example of Profile Page Template


Profile page template including profile extensions, etc., as used on www.wpsymposiumpro.com.

You will need to modify to match your own site, maybe removing items, or changing slugs.

This is an example only.

You can also read a much more in-depth look at the Profile Page, including a step-by-step guide on creating your own.

Remember, if copying and pasting from this website, you should paste into your WordPress editor in “Text” mode, to ensure that formatting is not changed. Check after pasting!


This is what it typically looks like (click the image to “zoom in”). On mobile devices, the content down the side will drop to the bottom.2016-05-21_12-30-11


This profile page, in particular the CSS, is designed to work with the TwentySixteen theme as supplied with WordPress. In the Custom CSS, for example, sidebars are hidden across the whole site, with a “dummy” sidebar then added in the page content above.

If using with another theme, you will need to consider, in particular, the custom CSS.

Page content

Edit your Profile page and put the following in. Make sure your editor is “Text” and not “Visual”. If you switch between Text and Visual, you may find it gets messed up, particular the apostrophes.


User does not exist!
Last logged in , and last active .





Put the following in WPS Pro> Setup> Custom CSS.


/* Social media icons */
#sg_social_media_icons {
    float: right; 
    width: 200px; 
    text-align: right;
.sg_social_media_icon {
    float: right;
.sg_margin {
    margin-right: 6px;
/* Set up activity area and "dummy" sidebar */
#sg_profile_activity_div {
    width: 70%;
    float: left;
#sg_profile_activity_sidebar_div {
    width: 20%;
    float: right;
/* Responsive bit */
@media screen and (max-width: 56.875em) {
    #sg_profile_activity_div, #sg_profile_activity_sidebar_div { width: 100%; float: none; }
    #sg_profile_activity_sidebar_div { margin-top: 40px; }
/* Second style for buttons in "dummy" sidebar */
.wps_button_2 {
    width: 100% !important;
    line-height: 30px;
    background-color: #000 !important;
    background-image: none;
    color: #fff;
.wps_button_2:hover {
    background-color: #510051 !important;
/* Remove sidebar (from all pages on the site) */
/* Important! Please read the "CSS" section below on this page about the following */
#secondary { display:none !important; }
.content-area { width: 100% !important; }



It is unlikely that you will be able to just use the page content shown above because, for example, it uses Profile Extensions for www.wpsymposiumpro.com


If you want to keep sidebars on your site, but just hide on your profile page so you can use this template, you could change the CSS
that removes the side bar to the following
(you will need to change 71 to the Page ID of your profile page):


.page-id-71 #secondary { display:none !important; }
.page-id-71 .content-area { width: 100% !important;