Let's play with the profile.template.php, just some basic rearranging

Started by shadav, June 30, 2020, 02:21:08 PM

Previous topic - Next topic

shadav

so I'm trying to work on the profile....
but for now, let's start small and simple
this is for the default (curve) theme
you'll need to adjust for other themes or if any mods installed

Profile.template.php

seems silly to have the email in 2 places....let's ditch the list and keep the icon

find and remove
// Only show the email address fully if it's not hidden - and we reveal the email.
if ($context['member']['show_email'] == 'yes')
echo '
<dt>', $txt['email'], ': </dt>
<dd><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></dd>';

// ... Or if the one looking at the profile is an admin they can see it anyway.
elseif ($context['member']['show_email'] == 'yes_permission_override')
echo '
<dt>', $txt['email'], ': </dt>
<dd><em><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></em></dd>';



now let's play with the Show Posts and Show Stats Links....
let's make them a little more useful....like linking the list for Posts: # (% per day) and since we're already on the profile let's link the user's name to their stats page

find
<br />';
echo '
<a href="', $scripturl, '?action=profile;area=showposts;u=', $context['id_member'], '">', $txt['showPosts'], '</a><br />
<a href="', $scripturl, '?action=profile;area=statistics;u=', $context['id_member'], '">', $txt['statPanel'], '</a>
</p>';

replace
</p>';

find
if (!isset($context['disabled_fields']['posts']))
echo '
<dt>', $txt['profile_posts'], ': </dt>
<dd>', $context['member']['posts'], ' (', $context['member']['posts_per_day'], ' ', $txt['posts_per_day'], ')</dd>';


replace
if (!isset($context['disabled_fields']['posts']))
echo '
<dt>', $txt['profile_posts'], ': </dt>
<dd><a href="', $scripturl, '?action=profile;area=showposts;u=', $context['id_member'], '">', $context['member']['posts'], '</a> (', $context['member']['posts_per_day'], ' ', $txt['posts_per_day'], ')</dd>';


find
<div class="username"><h4>', $context['member']['name'], ' <span class="position">', (!empty($context['member']['group']) ? $context['member']['group'] : $context['member']['post_group']), '</span></h4></div>

replace
<div class="username"><h4><a href="', $scripturl, '?action=profile;area=statistics;u=', $context['id_member'], '">', $context['member']['name'], '</a> <span class="position">', (!empty($context['member']['group']) ? $context['member']['group'] : $context['member']['post_group']), '</span></h4></div>


let's move the online image and ditch the words online

find
</ul>
<span id="userstatus">', $context['can_send_pm'] ? '<a href="' . $context['member']['online']['href'] . '" title="' . $context['member']['online']['label'] . '" rel="nofollow">' : '', $settings['use_image_buttons'] ? '<img src="' . $context['member']['online']['image_href'] . '" alt="' . $context['member']['online']['text'] . '" align="middle" />' : $context['member']['online']['text'], $context['can_send_pm'] ? '</a>' : '', $settings['use_image_buttons'] ? '<span class="smalltext"> ' . $context['member']['online']['text'] . '</span>' : '';

replace
</ul>
<span id="userstatus">';


find
<div class="username"><h4><a href="', $scripturl, '?action=profile;area=statistics;u=', $context['id_member'], '">', $context['member']['name'], '</a> <span class="position">', (!empty($context['member']['group']) ? $context['member']['group'] : $context['member']['post_group']), '</span></h4></div>

replace
<div class="username"><h4><a href="', $scripturl, '?action=profile;area=statistics;u=', $context['id_member'], '">', $context['member']['name'], '</a> ', $context['can_send_pm'] ? '<a href="' . $context['member']['online']['href'] . '" title="' . $context['member']['online']['label'] . '">' : '', '<img src="', $context['member']['online']['image_href'], '" alt="', $context['member']['online']['text'], '" />', $context['can_send_pm'] ? '</a>' : '';
echo '
<span class="position">', (!empty($context['member']['group']) ? $context['member']['group'] : $context['member']['post_group']), '</span></h4></div>



now let's change the gender text into an image

find
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', $context['member']['gender']['name'], '</dd>';


replace
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', context['member']['gender']['image'], '</dd>';

OR leave the text and add the image
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', $context['member']['gender']['name'], ' ', $context['member']['gender']['image'], '</dd>';


now it's have some fun
how about a little a/s/l?

find
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', $context['member']['gender']['name'], '</dd>';

echo '
<dt>', $txt['age'], ':</dt>
<dd>', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), '</dd>';

if (!isset($context['disabled_fields']['location']) && !empty($context['member']['location']))
echo '
<dt>', $txt['location'], ':</dt>
<dd>', $context['member']['location'], '</dd>';


replace
echo '
<dt>', $txt['age'], '';
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
/ ', $txt['gender'], '';
if (!isset($context['disabled_fields']['location']) && !empty($context['member']['location']))
echo '
/ ', $txt['location'], '';
echo '
:</dt>
<dd>', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), '';
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
/ ', $context['member']['gender']['name'], '';
if (!isset($context['disabled_fields']['location']) && !empty($context['member']['location']))
echo '
/ ', $context['member']['location'], '';
echo '
</dd>';


OR ;)
echo '
<dt>a/s/l :</dt>
<dd>', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), ' / ', $context['member']['gender']['image'], ' / ', $context['member']['location'], '</dd>';

why don't we toss that over into the mini profile on the left?
remove what you just added above

find
', $context['member']['avatar']['image'], '
<ul class="reset">';


replace
', $context['member']['avatar']['image'], '
<br />a/s/l : ', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), ' / ', $context['member']['gender']['image'], ' / ', $context['member']['location'], '
<ul class="reset">';



now let's change the Send PM from text to an image (like on the post profile) and we're going to move that up with the send email

find
';

echo '
</span>';

echo '
<p id="infolinks">';

if (!$context['user']['is_owner'] && $context['can_send_pm'])
echo '
<a href="', $scripturl, '?action=pm;sa=send;u=', $context['id_member'], '">', $txt['profile_sendpm_short'], '</a></p>';

echo '


replace
';
echo '
</span>
</div>


find
// What about if we allow email only via the forum??
add before
if ($context['can_send_pm'])
echo '
<li><a href="', $scripturl, '?action=pm;sa=send;u=', $context['member']['id'], '" title="', $context['member']['online']['is_online'] ? $txt['pm_online'] : $txt['pm_offline'], '">', $settings['use_image_buttons'] ? '<img src="' . $settings['images_url'] . '/im_' . ($context['member']['online']['is_online'] ? 'on' : 'off') . '.gif" alt="' . ($context['member']['online']['is_online'] ? $txt['pm_online'] : $txt['pm_offline']) . '" />' : ($context['member']['online']['is_online'] ? $txt['pm_online'] : $txt['pm_offline']), '</a></li>';



let's change the membergroup from text to image (and also move it out from the h4)

find
<span class="position">', (!empty($context['member']['group']) ? $context['member']['group'] : $context['member']['post_group']), '</span></h4>

replace
</h4></div>';
// Show the post group if and only if they have no other group or the option is on, and they are in a post group.
if ((empty($settings['hide_post_group']) || $context['member']['group'] == '') && $context['member']['post_group'] != '')
echo '
', $context['member']['post_group'], ' ';
echo '
', $context['member']['group_stars'], ' ';
echo '


and while we are at it, let's move the custom title over there too

find and remove
if (!empty($modSettings['titlesEnable']) && !empty($context['member']['title']))
echo '
<dt>', $txt['custom_title'], ': </dt>
<dd>', $context['member']['title'], '</dd>';


find
// Show the post group if and only if they have no other group or the option is on, and they are in a post group.
if ((empty($settings['hide_post_group']) || $context['member']['group'] == '') && $context['member']['post_group'] != '')
echo '
', $context['member']['post_group'], ' ';
echo '
', $context['member']['group_stars'], ' ';


after add
if (!empty($modSettings['titlesEnable']) && !empty($context['member']['title']))
echo '
<br />', $context['member']['title'], ' ';



now for my ocd, let's move the last active below the date registered

find
echo '
<dt>', $txt['lastLoggedIn'], ': </dt>
<dd>', $context['member']['last_login'], '</dd>
</dl>';


replace
echo '
</dl>';


find
echo '
<dt>', $txt['date_registered'], ': </dt>
<dd>', $context['member']['registered'], '</dd>';


add after
echo '
<dt>', $txt['lastLoggedIn'], ': </dt>
<dd>', $context['member']['last_login'], '</dd>';


and again for my ocd let's move the registered date and last active date up under the username
find and remove
echo '
<dt>', $txt['date_registered'], ': </dt>
<dd>', $context['member']['registered'], '</dd>';

echo '
<dt>', $txt['lastLoggedIn'], ': </dt>
<dd>', $context['member']['last_login'], '</dd>';


find
if ($context['user']['is_owner'] || $context['user']['is_admin'])
echo '
<dt>', $txt['username'], ': </dt>
<dd>', $context['member']['username'], '</dd>';


after add
echo '
<dt>', $txt['date_registered'], ': </dt>
<dd>', $context['member']['registered'], '</dd>';

echo '
<dt>', $txt['lastLoggedIn'], ': </dt>
<dd>', $context['member']['last_login'], '</dd>';



ok now let's play with the avatar
how about making it larger and round?

index.css
find
#basicinfo img.avatar
{
display: block;
margin: 10px 0 0 0;
}


replace
#basicinfo img.avatar
{
display: block;
margin: 10px 0px 10px 0px;
width: 80%;
border-radius: 80px;
}


maybe move it above the username?
back in Profile.template.php
find and remove
', $context['member']['avatar']['image'], '

find
<div class="username"><h4>

add before
', $context['member']['avatar']['image'], '


ok now, the username....does it really need to be on the list? Only admins and the owner can see it....so let's move it

find and remove
if ($context['user']['is_owner'] || $context['user']['is_admin'])
echo '
<dt>', $txt['username'], ': </dt>
<dd>', $context['member']['username'], '</dd>';


find
echo '
</h4></div>';


replace
echo '
</h4>';
if ($context['user']['is_owner'] || $context['user']['is_admin'])
echo '
( ', $context['member']['username'], ' )';
echo '
</div>';



let's move the signature

find and remove
// Show the users signature.
if ($context['signature_enabled'] && !empty($context['member']['signature']))
echo '
<div class="signature">
<h5>', $txt['signature'], ':</h5>
', $context['member']['signature'], '
</div>';


find
<div class="clear"></div>
</div>';


replace
<div class="clear"></div>';

// Show the users signature.
if ($context['signature_enabled'] && !empty($context['member']['signature']))
echo '
<div class="cat_bar">
<h5 class="catbg">
<span class="ie6_header floatleft"><img src="', $settings['images_url'], '/post/xx.gif" alt="" class="icon" />', $txt['signature'], '</span>
</h5>
</div>
<div class="windowbg2">
<span class="topslice"><span></span></span>
<div class="content">
', $context['member']['signature'], '
</div>
<span class="botslice"><span></span></span>

</div>';
echo '

</div>';

drewactual

nice work! 

i've done something like this too... right now, though, i'm working on making it appear more like a prominent social media profile somewhat- and function where 'friends' post messages on a wall notifies the users... trying to invade the space of a faltering social media page... leveraging familiarity... the 'function' isn't there yet, but i'm getting the UI set up... some of your suggestions will go into some use for sure!

(credit to smfpacks for this)



Mick.

Nice work indeed!  :D
I too been messing with removing double links. Most of my themes I do that. Anyways, here's a basic profile that I was messing with a while ago but have not finished it lol https://www.idesignsmf.com/index.php/page,simple_profile.html

shadav

Quote from: drewactual on July 01, 2020, 11:54:05 AM
nice work! 

i've done something like this too... right now, though, i'm working on making it appear more like a prominent social media profile somewhat- and function where 'friends' post messages on a wall notifies the users... trying to invade the space of a faltering social media page... leveraging familiarity... the 'function' isn't there yet, but i'm getting the UI set up... some of your suggestions will go into some use for sure!

(credit to smfpacks for this)

nice, this is sort of what my aim is at, eventually....

Quote from: Mick. on July 01, 2020, 12:02:45 PM
Nice work indeed!  :D
I too been messing with removing double links. Most of my themes I do that. Anyways, here's a basic profile that I was messing with a while ago but have not finished it lol https://www.idesignsmf.com/index.php/page,simple_profile.html
I like this...

eventually I'm thinking to try and make the profile sort of like a social networking profile or more around the lines of like a resume of sorts

I donno, lol just that it bugs me and needs a desperate face lift and major plastic surgery

less information overload and more eye candish

Deaks

Some of these are really nice not fan of the bigger avatars  or the asl but rest I like
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

Antechinus

Lol. I need some more coffee to sort though all of that. :D Some good tweaks in there. Some others I'm not so keen on, but the good thing about this sort of coding is that it's easy to tweak for your own preferences.

Kindred

Overall, I'm not a huge fan of "compression" like that.

I use the Ultimate Profile mod on several of the sites I manage... 
I like that layout (I reconfigured the original to use all <div> instead of tables - makes adding new "boxes" simple)
but even if I didn't use the mod, doing it into a tiles layout seems more friendly to actually finding information...  putting links "hidden" under text (like the link to show posts) is a big no-no, in my book. I removed it entirely and made it a menu item (with mobile friendly, css-handled, collapsible menus)
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Mick.

Quote from: Kindred on July 01, 2020, 06:27:49 PM
Overall, I'm not a huge fan of "compression" like that.

I use the Ultimate Profile mod on several of the sites I manage... 
I like that layout (I reconfigured the original to use all <div> instead of tables - makes adding new "boxes" simple)
but even if I didn't use the mod, doing it into a tiles layout seems more friendly to actually finding information...  putting links "hidden" under text (like the link to show posts) is a big no-no, in my book. I removed it entirely and made it a menu item (with mobile friendly, css-handled, collapsible menus)
Nice!

shadav

yeah I could never get the ultimate profile mod or the user cpu mod to work

Antechinus was helping with a css version of sorts on a look like cpu mod, which looked pretty nice

hehehehe the a/s/l is just me playing around  :laugh:

hm....well not trying to hide links, just thought it'd be more useful if the actual number of posts linked to the user's posts

and the stats figured why not.... they are both already available under the profile info menu

and figuring that not everyone will like everything (customization is key here), so I broke it up into parts for people to pick and choose what if any they like and can use :D

granted, I'm not done playing with the profile just yet....but that was enough for one day  :laugh:
thinking to take all of the admin only visible info on the profile and put it into it's own section like with the signature

Deaks

I look forward to seeing what else you do with the default files, maybe also look at how you could do some changes like this for 2.1 while its not finished any tips and tricks can make a difference and be great to get this board more active again.
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

gecitli

http://www.webtiryaki.com
webmaster forumu
Free & Premium Responsive Themes for SMF.

Deaks

teşekkür, however my turkish is rusty im not sure what you are trying to show with the screenshot sorry.
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

gecitli

Quote from: Deaks on July 02, 2020, 06:03:18 AM
teşekkür, however my turkish is rusty im not sure what you are trying to show with the screenshot sorry.

ok see live
Username: demo

Password: 1234

https://webtiryaki.com/index.php
http://www.webtiryaki.com
webmaster forumu
Free & Premium Responsive Themes for SMF.

shadav

that's pretty nice


yeah, I haven't even touched 2.1 at all

might install a demo to play with

after playing around with all of this, decided to attempt at a theme...lol we'll see....basically just playing with the default theme and variants....

Deaks

i have implemented these on SMF Review update and some new ones based on these so big thank you
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

shadav

playing a bit more

let's break up the summary title bar


find and remove
<div class="cat_bar">
<h3 class="catbg">
<span class="ie6_header floatleft"><img src="', $settings['images_url'], '/icons/profile_sm.gif" alt="" class="icon" />', $txt['summary'], '</span>
</h3>
</div>

find
<div id="basicinfo">
add after
<div class="cat_bar">
<h3 class="catbg">
<span class="ie6_header floatleft"><img src="', $settings['images_url'], '/icons/profile_sm.gif" alt="" class="icon" />', $txt['summary'], '</span>
</h3>
</div>

find
<div id="detailedinfo">
add after
<div class="cat_bar">
<h3 class="catbg">
<span class="ie6_header floatleft"><img src="', $settings['images_url'], '/icons/info.gif" alt="', $txt['summary'], '" class="icon" />', $txt['summary'], '</span>
</h3>
</div>


OR let's move the username into the title bar
[find]<div id="basicinfo">[/code]
add after
<div class="cat_bar">
<h3 class="catbg">
<span class="ie6_header floatleft"><img src="', $settings['images_url'], '/icons/profile_sm.gif" alt="" class="icon" />', $context['member']['name'], '</span>
</h3>
</div>

find and remove
', $context['member']['name'], '

shadav

let's make some things only visible to buddies

for age
find
echo '
<dt>', $txt['age'], ':</dt>
<dd>', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), '</dd>';

replace
if ($context['member']['is_buddy'] || $context['user']['is_owner'] || $context['user']['is_admin'])
{
echo '
<dt>', $txt['age'], ':</dt>
<dd>', $context['member']['age'] . ($context['member']['today_is_birthday'] ? ' &nbsp; <img src="' . $settings['images_url'] . '/cake.png" alt="" />' : ''), '</dd>';
}


for location
find
if (!isset($context['disabled_fields']['location']) && !empty($context['member']['location']))
echo '
<dt>', $txt['location'], ':</dt>
<dd>', $context['member']['location'], '</dd>';

replace
if ($context['member']['is_buddy'] || $context['user']['is_owner'] || $context['user']['is_admin'])
{
if (!isset($context['disabled_fields']['location']) && !empty($context['member']['location']))
echo '
<dt>', $txt['location'], ':</dt>
<dd>', $context['member']['location'], '</dd>';
}


for gender
find
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', $context['member']['gender']['name'], '</dd>';

replace
if ($context['member']['is_buddy'] || $context['user']['is_owner'] || $context['user']['is_admin'])
{
if (!isset($context['disabled_fields']['gender']) && !empty($context['member']['gender']['name']))
echo '
<dt>', $txt['gender'], ': </dt>
<dd>', $context['member']['gender']['name'], '</dd>';
}


for email
find
if ($context['member']['show_email'] === 'yes' || $context['member']['show_email'] === 'no_through_forum' || $context['member']['show_email'] === 'yes_permission_override')
echo '
<li><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '" title="', $context['member']['show_email'] == 'yes' || $context['member']['show_email'] == 'yes_permission_override' ? $context['member']['email'] : '', '" rel="nofollow"><img src="', $settings['images_url'], '/email_sm.gif" alt="', $txt['email'], '" /></a></li>';

replace
if ($context['member']['is_buddy'] || $context['user']['is_owner'] || $context['user']['is_admin'])
{
if ($context['member']['show_email'] === 'yes' || $context['member']['show_email'] === 'no_through_forum' || $context['member']['show_email'] === 'yes_permission_override')
echo '
<li><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '" title="', $context['member']['show_email'] == 'yes' || $context['member']['show_email'] == 'yes_permission_override' ? $context['member']['email'] : '', '" rel="nofollow"><img src="', $settings['images_url'], '/email_sm.gif" alt="', $txt['email'], '" /></a></li>';
}

find
if ($context['member']['show_email'] == 'yes')
echo '
<dt>', $txt['email'], ': </dt>
<dd><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></dd>';

// ... Or if the one looking at the profile is an admin they can see it anyway.
elseif ($context['member']['show_email'] == 'yes_permission_override')
echo '
<dt>', $txt['email'], ': </dt>
<dd><em><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></em></dd>';

replace
if ($context['member']['is_buddy'] || $context['user']['is_owner'] || $context['user']['is_admin'])
{
if ($context['member']['show_email'] == 'yes')
echo '
<dt>', $txt['email'], ': </dt>
<dd><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></dd>';

// ... Or if the one looking at the profile is an admin they can see it anyway.
elseif ($context['member']['show_email'] == 'yes_permission_override')
echo '
<dt>', $txt['email'], ': </dt>
<dd><em><a href="', $scripturl, '?action=emailuser;sa=email;uid=', $context['member']['id'], '">', $context['member']['email'], '</a></em></dd>';
}


Arantor

Wait until you tell people that writing a regular mod is exactly the same as tweaking the templates and you realise that it's all literally the same thing :P

shadav

Quote from: Antechinus on July 05, 2020, 06:28:17 PM
It's addictive, isn't it? :D

:laugh: :laugh: :laugh:

Quote from: Arantor on July 05, 2020, 06:49:01 PM
Wait until you tell people that writing a regular mod is exactly the same as tweaking the templates and you realise that it's all literally the same thing :P
hm.... i've looked at some mods and from my understanding just need to make the xml file....and remember that it's backwards, search before and add is actually adding it after

Advertisement: