Support Forum

Advanced Search
Forum Scope


Match



Forum Options



Minimum search word length is 3 characters - maximum search word length is 84 characters
general-topic
How Do You Make Faded Out Effect For Members Sections For Guests?
Avatar
D Barber
Member
Free Members
sp_UserOfflineSmall Offline
Jun 19, 2014 - 9:43 pm

First of all,

Thanks for such an awesome product.  

 

One thing that really sticks out to me that's incredibly unique on the forum on this site is

A)When you are a guest/not logged in,   the "Non-Members Area" goes from the bottom of the screen to the top

That in itself is an awesome feature that I'm also curious about

But more particularly, as to stay on the original topic, I absolutely LOVE how the section for members such as the "Member Support" is faded out when you are a guest.  (pic attached below as reference)

 

This creates the ultimate teaser effect visually.

Would be so grateful if some direction could be given on how exactly that faded effect could be duplicated.     (IE: changes in child theme, CSS, etc)

 

Thanks in Advance!

 

faded-forums.pngImage Enlarger

Avatar
Mr Papa
Simi Valley, CA
SP Master
Free Members
sp_UserOfflineSmall Offline
Jun 19, 2014 - 9:55 pm

css...  each group (forum too) has a unique id...  so for the groups you want, just add another class and style it...

so for us:

                            $spOpaque = '';
                             if($spThisUser->guest && $spThisGroup->group_id != 19) $spOpaque = ' spOpaque';

and then add the style to the group display:

                                sp_ColumnStart("tagClass=spColumnSection spLeft$spOpaque&width=6%&height=55px");
                                    sp_ForumIndexIcon('tagClass=spRowIcon spLeft');
                                sp_ColumnEnd();

in our spGroupView.php template file adds an opacity style to those forums for a guest...

Avatar
D Barber
Member
Free Members
sp_UserOfflineSmall Offline
Jun 20, 2014 - 8:13 pm

Hey,

Before getting into the question about styling, just trying to see if I'm even on the right track.   (Full disclosure I have very little knowledge of CSS/Code)

#1) So first thing I did was go try to replace the following lines in the spGroupView.php file that are listed as being "Column 1 of the forum row"

sp_ColumnStart('tagClass=spColumnSection spLeft&width=6%&height=55px');
sp_ForumIndexIcon('tagClass=spRowIcon spLeft');

with the above listed code of

sp_ColumnStart("tagClass=spColumnSection spLeft$spOpaque&width=6%&height=55px");
sp_ForumIndexIcon('tagClass=spRowIcon spLeft');

(Now when I see them side by side I notice the only difference is the $spOpaque line added before the width and height)

#2) Then per the above instructions, I located the Group ID#s that are listed on the Manage Group and Forums tab

#3) Based on that, I changed the above code for the Groups IDs 2-5 as follows:

 $spOpaque = '';
 if($spThisUser->guest && $spThisGroup->group_id != 2) $spOpaque = ' spOpaque';
$spOpaque = '';
 if($spThisUser->guest && $spThisGroup->group_id != 3) $spOpaque = ' spOpaque';
$spOpaque = '';
 if($spThisUser->guest && $spThisGroup->group_id != 4) $spOpaque = ' spOpaque';
$spOpaque = '';
 if($spThisUser->guest && $spThisGroup->group_id != 5) $spOpaque = ' spOpaque';

Assuming that those first few steps were correct, my big question now is 

A) Where exactly to place the code.   

(I tried to add it to the default.php file but I didn't notice any changes in the status.  Same for GroupView file )

B) Am I supposed to be plugging/chugging or complimenting some other code for it to have any noticeable 
effect in the first place?  (Which could obviously explain why I haven't seen any effects on the opacity for guests) 



Thanks Again in Advance!
Avatar
Mr Papa
Simi Valley, CA
SP Master
Free Members
sp_UserOfflineSmall Offline
Jun 20, 2014 - 10:20 pm

not exactly sure what you are doing... ie make it opaque for IDs 2-5 or not opaque...  but following your lead, after:

    sp_SectionStart('tagClass=spBodyContainer', 'body');

you want to add it... I would change it to:

$spOpaque = '';
if ($spThisUser->guest) { 
    if ($spThisGroup->group_id < 2 || $spThisGroup->group_id > 5) $spOpaque = ' spOpaque';
}
Avatar
D Barber
Member
Free Members
sp_UserOfflineSmall Offline
Jun 30, 2014 - 6:29 pm

Hey I'm still struggling with this one.

To clarify my objective is to make the Group 1 ID to fully appear, and for the Group IDs #4 through #5

to appear transparent.

 

I added the below code right under the section of sp_SectionStart('tagClass=spBodyContainer', 'body');

$spOpaque = '';
if ($spThisUser->guest) { 
    if ($spThisGroup->group_id < 2 || $spThisGroup->group_id > 5) $spOpaque = ' spOpaque';
}

 

Unfortunately I could still not get anything to noticeably change in the opacity/transparency department.

I read up a bit on the opacity factor and how it can be used to change images

Ex: img {opacity: 0.4; 

filter: alpha (opacity = 40);

http://www.w3schools.com/css/c.....arency.asp

 

I now see how there are scales from 0-1 and 0 to 100 and how the lower the number the more transparent the image.

However, I tried plugging and chugging numbers in the above and I still could not get any forum in the Group View to change.   Am I still missing a key piece?   Also, is there something I have to change in the default.php file regarding the opacity as well?

Thanks Again in Advance!

 

Avatar
Mr Papa
Simi Valley, CA
SP Master
Free Members
sp_UserOfflineSmall Offline
Jun 30, 2014 - 7:39 pm

first, if you want groups 4 and 5 to have the opacity, then you need to update the IDs in the code...  something like:

if ($spThisGroup->group_id == 4 || $spThisGroup->group_id == 5) $spOpaque = ' spOpaque';

then for the style, we use:

.spOpaque {
    opacity: .5;
}

Forum Timezone: Europe/Stockholm
Most Users Ever Online: 1170
Currently Online:
Guest(s) 1
Currently Browsing this Page:
1 Guest(s)
Top Posters:
Mr Papa: 19448
Ike: 2086
Brandon: 864
kvr28: 804
jim: 650
FidoSysop: 577
Conrad_Farlow: 531
fiddlerman: 358
Stefano Prete: 325
Member Stats:
Guest Posters: 620
Members: 17365
Moderators: 0
Admins: 4
Forum Stats:
Groups: 7
Forums: 17
Topics: 10128
Posts: 79626