Coders Refuge Tutorials

Cookie Settings

Wed, 10 Mar 2010 20:46:14 +0000

I see a fair few topics where people are having issues staying logged into their board. I thought I would write a very quick tutorial explaining a recommended settings.

This is not a "one size fits all" tutorial, but I think most boards will be OK with these settings, although there will always be exceptions.

Navigate here > ACP > System > Tools / Settings > "system" > System Settings > Cookies

Cookie Domain ... Just put your URL into here with a . prefix, regardless of whether your board is at www.site.com or www.site.com/forum, it does not matter. Don't forget the leading . , Example:

.www.site.com

Cookie Name Prefix ... You can normally leave blank unless you have multiple IPB's installed on this domain. I would suggest you put in something to identify your board simply to help if you decide to install any other applications to your domain. Something like

-forum-

is ideal to enter here.

Cookie Path ... Typically you can leave this blank.

See how those cookie settings effect things to start with. I will list a few more things to look at if needed, but in most cases they are quite sufficient.

ACP > System > Tools / Settings > "system" > System Settings > Security and Privacy > "Security - High"

Enable X_FORWARDED_FOR IP matching? ... Ideally this should stay off. I found in some cases (for me this was people in the UK using the AOL ISP and the AOL browser) it needed to be enabled.

Member's log in key: Expiration ... Do not set this to "Do not expire" , set to a suitable setting for your board (Recommended setting "Expire after 3 days")

Reset member's log in key upon each log in? ... The default for this is off already. You probably will be able to leave it at that in most cases.

Match user's IP Address during session validation ... The default for this is no. This will probably suit most boards. If you have a lot of members who repeatedly get logged out (In my case AOL users, see my note above) , you may want to try switching it on.

Match user's browser during session validation ... Again, the default for this is no. You can switch this on if you want to try to increase the security of your board a little further.

As above, not everything will work for everyone, but I hope this simple tutorial proves useful

Replacing Blank Photo with Avatar

Tue, 09 Mar 2010 20:56:11 +0000

These are Template edits to replace the default Profile Photo Pic with an avatar. These are what I can find off the top, If you need one, or find one that's not mentioned here and would like for me to add it please feel free to post a comment here, on my profile or PM me. Hope this helps you all.

Disclaimers:
Odd shaped avatars will appear odd. By this I mean if the avatar isn't perfectly square these edits will not scale them properly. Unfortunately I wouldn't know of a way to simply scale the proportions.
If Gravatars are enabled then people that don't have a photo or an avatar will get a blank nothing in place of the default icon. Unfortunately I wouldn't know how to work around that. Sorry dears.

Profile Replacement:
Profiles > profileModern
Find:

			lang->words['users_photo']}"  />

Replace with:

			
{$member['avatar']}lang->words['users_photo']}" />

Friends Replacement in the Member profile:
Find:

lang->words['photo']}' class='photo' />

Replace:

                        

settings['board_url']}/uploads/{$friend['avatar_location']}' alt="{$friend['members_display_name']}{$this->lang->words['users_photo']}" width='{$friend['pp_thumb_width']}' height='{$friend['pp_thumb_width']}' class='photo' />

lang->words['users_photo']}" width='{$friend['pp_thumb_width']}' height='{$friend['pp_thumb_height']}' class='photo' />

lang->words['users_photo']}" width='{$friend['pp_thumb_width']}' height='{$friend['pp_thumb_height']}' />

Latest Visitor on Profile:
Find:

lang->words['photo']}' class='photo' />

Replace:




settings['board_url']}/uploads/{$friend['avatar_location']}' alt="{$friend['members_display_name']}{$this->lang->words['users_photo']}" width='{$friend['pp_mini_width']}' height='{$friend['pp_mini_width']}' class='photo' />

lang->words['users_photo']}" width='{$friend['pp_mini_width']}' height='{$friend['pp_mini_height']}' class='photo' />

lang->words['users_photo']}" width='{$friend['pp_mini_width']}' height='{$friend['pp_mini_height']}' class='photo' />

Member Box icon in the top right:
Global Templates > globalTemplates > Find:

						memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>memberData['pp_thumb_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_thumb_width']}' height='{$this->memberData['pp_thumb_height']}' class='photo' />

Replace:

			memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>




settings['board_url']}/uploads/{$this->memberData['avatar_location']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_thumb_width']}' height='{$this->memberData['pp_thumb_width']}' class='photo' />

memberData['avatar_location']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_thumb_width']}' height='{$this->memberData['pp_thumb_height']}' class='photo' />

memberData['pp_thumb_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_thumb_width']}' height='{$this->memberData['pp_thumb_height']}' class='photo' />

For Memberlist replacement:
Member List > member_list_show
Find:

						lang->words['users_photo']}" class='photo' />

Replace:

                        

settings['board_url']}/uploads/{$member['avatar_location']}' alt="{$member['members_display_name']}{$this->lang->words['users_photo']}" width='{$member['pp_thumb_width']}' height='{$member['pp_thumb_width']}' class='photo' />

lang->words['users_photo']}" width='{$member['pp_thumb_width']}' height='{$member['pp_thumb_height']}' class='photo' />

lang->words['users_photo']}" width='{$member['pp_thumb_width']}' height='{$member['pp_thumb_height']}' />

Board Index > hookBoardIndexStatusUpdates
Find:

memberData['pp_mini_photo']}' width='{$this->memberData['pp_mini_width']}' height='{$this->memberData['pp_mini_height']}' class='photo' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" />

Replace:




settings['board_url']}/uploads/{$this->memberData['avatar_location']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_mini_width']}' height='{$this->memberData['pp_mini_width']}' class='photo' />

memberData['avatar_location']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_mini_width']}' height='{$this->memberData['pp_mini_height']}' class='photo' />

memberData['pp_thumb_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_mini_width']}' height='{$this->memberData['pp_mini_height']}' class='photo' />

Status Update Two:
Same file as above.
Find:

lang->words['users_photo']}" />

Replace:




settings['board_url']}/uploads/{$r['avatar_location']}' alt="{$r['members_display_name']}{$this->lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_width']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_height']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_height']}' class='photo' />

Board Index > hookTopPosters
Find:

lang->words['photo']}' class='photo' />

Replace:




settings['board_url']}/uploads/{$r['avatar_location']}' alt="{$r['members_display_name']}{$this->lang->words['users_photo']}" width='{$r['pp_thumb_width']}' height='{$r['pp_thumb_width']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_thumb_width']}' height='{$r['pp_thumb_height']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_thumb_width']}' height='{$r['pp_thumb_height']}' class='photo' />

Board Index > hookRecentBlogEntries
Find:

Add AFTER:





settings['board_url']}/uploads/{$r['avatar_location']}' alt="{$r['members_display_name']}{$this->lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_width']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_height']}' class='photo' />

lang->words['users_photo']}" width='{$r['pp_mini_width']}' height='{$r['pp_mini_height']}' class='photo' />

Cheers!

Simple Validating Message

Mon, 08 Mar 2010 19:37:39 +0000

Sometimes, new members (especially those new to forums) may not always be aware they need to validate their account. I used to have a simple message back on 2.x.x to help them and have now done something similar for IP.Board 3.

It's a very simple skin edit to create a box with a reminder message in it.

ACP > Look / Feel > Manage Skin Sets / Templates > (choose skin) > Manage Templates / CSS > Global Templates > GlobalTemplate >

Scroll down about 3/4 of the way down that template and find:

			
				
				{$html}

Add this above, after the closing div on a new line:

<!-- validating message-->




settings['img_url']}/comment_new.png'> Thank you for registering!

As part of the registration process, we require you to validate your email address. You will need to do this before you can post.


Please check your inbox for your validation email from us and click the link provided in it. If you did not receive this, please Click Here to resend it.





<!-- end of validating message -->

Save the template.

This is the simple message all validating members will now see, along with the extra link to click for a new email if required. You can easily customise the message (for example by allowing validating members to post in a certain forum) as required.

Making the Topic tab active by default on the Watched Items hook

Wed, 03 Mar 2010 14:07:44 +0000

To make the Topics tab active by default, edit the Board Index -> hookWatchedItems skin template, find this code:

			
				{$this->lang->words['watched_forums']}
				{$this->lang->words['watched_topics']}

Change it to:

			
				{$this->lang->words['watched_forums']}
				{$this->lang->words['watched_topics']}

Find:

Change it to:

Save the template, repeat for each skin.

Edit the /public/js/ips.hooks.js file, and change this code:

	activeTab: 'forums',

To this:

	activeTab: 'topics',

Save and upload.

Creating a topic from a calendar event

Tue, 02 Mar 2010 16:00:59 +0000

Although basic, this does work.

1 > Start with the calendar. (ACP > My Apps > Calendar > Edit Calendar)

2 > Under "RSS Options" , set "RSS: Enable" to YES.

3> Set "RSS: Forthcoming Days" to the same as you have set for displaying on the board view (Tools / Settings > Calendar And Birthdays) "Show forthcoming events from today to [x] days ahead". It is important that these two match. In my case I have them set both at 14 days.

3 > Back to the calendar settings again and set "RSS: Update Frequency" to 1440 (1 day)

4 > Next set "Permission: Show Events" to make sure Guests can view events. This is needed for the exporter to work properly.

5 > Go back to the main calendar management screen and click on the options to rebuild the calendars RSS export.

6 > Visit your boards index page and click on the orange RSS icon. View the RSS and save the URL for later. This will be something like

http://www.boardurl.com/forum/index.php?/rss/calendar/1-community-calendar/

7 > Now visit the RSS import manager. (Forums > RSS Management > RSS Import Manager)

8 > Validate your URL feed in the validate box. Make a note of the character set (in my case this was ISO-8859-1)

9 > Next create a new RSS import. Fill in the information putting a description in and the saved URL and character set from earlier. Pick a forum / username for the import too.

10 > Leave the "RSS Import Refresh" at 200 as the events will only be exported daily, x days in advance, depending on what you set. I also chose to set the "RSS Import Topic Prefix" to "[Calendar] " (note the space afterwards)

11 > That's it! Be patient and do not run the calendar RSS cache or the RSS cache tools unnecessarily. It took it 14 days in my case (as that's what the events were set at) to begin to work but it does the job well.

Adding back the ipbwrapper to get control of your board again

Sat, 27 Feb 2010 01:20:38 +0000

Screenshot explains it .

I would recommend sticking this code after the body tag in ipb_styles.css!

#ipbwrapper{ background: #B6C7DB; margin: 0 auto 0 auto; width: 1152px; min-width: 1152px; border-left: 1px solid #000; border-right: 1px solid #000; }

This is very editable, you can change the background and borders or choose not to have them! The width has to be there, but can be any value you please!

Thats about it!

Create a third navigation bar

Sat, 27 Feb 2010 01:11:30 +0000

This was done due to a user asking on how to do it, so I figured I would share it!
This moves the search function and user details into the new bar!
Where it has { style_images_url }, remove the spaces between the { s and l }
These edits are based off an untouched IP.Board theme.

Find and remove this code in the globalTemplate:


						
						
						
						{$this->request['search_app']}{$this->registry->getCurrentApplication()}forums]=1" base="public"}" method="post" id='search-box' >
						
							
							
								{$this->lang->words['sj_search']}
								
								
								{$this->lang->words['advanced']}

Next remove this bit of code:

				
					
						memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>memberData['pp_thumb_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" width='{$this->memberData['pp_thumb_width']}' height='{$this->memberData['pp_thumb_height']}' class='photo' />
						
							
								{$this->lang->words['logged_in_as']} 
								memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>{$this->memberData['members_display_name']} settings['img_url']}/opts_arrow.png' alt='>' />lang->words['msg_new']}'>{$this->memberData['msg_count_new']} {$this->lang->words['msg_new']}
							
							
								{$this->lang->words['my_profile']}
								{$this->lang->words['your_cp']}
								
									{$this->lang->words['your_messenger']} ({$this->memberData['msg_count_new']} {$this->lang->words['msg_new']})
								
								{$this->lang->words['manage_friends']}
								{$this->lang->words['manage_ignored_users']}
								
									{$this->lang->words['my_blog']}
								
								
									{$this->lang->words['my_gallery']}
								
							
							
								member->form_hash}" base="public"}">{$this->lang->words['log_out']}
								{$this->lang->words['sj_help']}
								
									{$this->lang->words['resend_val']}
								
							
							
							{parse js_module="friends"}
						
					
				
					
						{parse replacement="signin_icon"} {$this->lang->words['sign_in']}
						{parse replacement="register_icon"} {$this->lang->words['register']}
						{parse replacement="help_icon"} {$this->lang->words['sj_help']}

Now after this code:

									{IPSLib::getAppTitle( $data['app_dir'] )}

Add the following:

<!--Extra Navigation Bar-->






{$this->request['search_app']}{$this->registry->getCurrentApplication()}forums]=1" base="public"}" method="post" id='search-box' >


{$this->lang->words['sj_search']}


{$this->lang->words['advanced']}






memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>memberData['pp_thumb_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" class='photo' />


memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>{$this->memberData['members_display_name']} settings['img_url']}/opts_arrow.png' alt='>' />



{$this->lang->words['your_messenger']} ({$this->memberData['msg_count_new']} {$this->lang->words['msg_new']})

member->form_hash}" base="public"}">{$this->lang->words['log_out']}
{$this->lang->words['sj_help']}

{$this->lang->words['resend_val']}



<!-- Menu -->

{$this->lang->words['my_profile']}
{$this->lang->words['your_cp']}

{$this->lang->words['your_messenger']} ({$this->memberData['msg_count_new']} {$this->lang->words['msg_new']})

{$this->lang->words['manage_friends']}
{$this->lang->words['manage_ignored_users']}

{$this->lang->words['my_blog']}


{$this->lang->words['my_gallery']}


<!-- End Menu -->


{parse js_module="friends"}



{parse replacement="signin_icon"} {$this->lang->words['sign_in']}
{parse replacement="register_icon"} {$this->lang->words['register']}
{parse replacement="help_icon"} {$this->lang->words['sj_help']}
			



<!--End Extra Navigation Bar-->

Now save globalTemplate!
Now for the last part go into ipb_styles.css

Find this:

#user_navigation {
	background: #2b4f74;
	font-size: 0.9em;
	border-width: 0 2px 2px 2px;
	border-style: solid;
	border-color: #1c334e;
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	position: absolute;
	top: 7px;
	right: 10px;
	float: right;
	z-index: 9999;
}

	#user_navigation .photo {
		border: 1px solid #1d3652;
		margin: 6px 10px 6px 6px;
		float: left;
	}
	
	#user_info {
		margin-left: 60px;
		margin-right: 15px;
	}
	
	#user_navigation p {
		color: #d9e3ed;
		margin-top: 6px;
		white-space: nowrap;
	}
	
		#user_navigation p a {
			color: #a1bad3;
		}
		
	#user_navigation #new_msg_count {
		background-color: #528f6c;
		font-weight: bold;
		font-size: 0.9em;
		padding: 3px 7px;
		top: 0px;
		left: 45px;
		position: absolute;
	}
		
		#user_navigation ul {
			font-size: 0.88em;
			margin-top: 4px;
		}
			#user_navigation ul a {
				color: #d5dde5;
			}
			
			#user_navigation ul#user_other {	
				margin-left: 5px;
			}
			
			#user_navigation ul#user_other li {
				float: left;
				padding: 0 4px;
			}
	
	#user_navigation ul#user_link_menucontent {
		background: #d5dde5;
		border: 1px solid #1d3652;
		margin-top: 0px;
		width: 170px;		
		float: right;
		z-index: 10000;
	}

		#user_navigation ul#user_link_menucontent li {
			padding: 1px;
			float: none;
		}

		#user_navigation ul#user_link_menucontent a {
			color: #1d3652;
			text-decoration: none;
			padding: 5px 5px 5px 15px;
			display: block;
		}

			#user_navigation ul#user_link_menucontent a:hover {
				background: #528f6c;
			}
			
	#user_navigation #user_link {
		background: #1d3652 url({ style_images_url }/th_bg.png) repeat-x 50%;
		border: 1px solid #1d3652;
		padding: 3px 20px 3px 10px;
		margin: 6px 0 0px 8px;
		min-width: 150px;
		-moz-outline: 0px;
		position: relative;
		display: block;
		overflow: hidden;
	}

		#user_navigation #user_link img {
			right: 5px;
			top: 8px;
			position: absolute;
		}

	#user_navigation.not_logged_in {
		font-size: 1em;
		padding: 15px 25px;
	}

		#user_navigation.not_logged_in a {
			margin: 0 10px;
		}

Replace it with this:

/* Begin Edits */
#third_nav {
	background: #192b40 url({ style_images_url }/primarynav_bg.png) no-repeat;
	font-size: 0.95em;
	border-bottom: 5px solid #528f6c;
	padding-left: 10px;
	height: 31px;	
}
	
#user_links a { 
	padding: 0 5px 0 10px;
	margin: 7px 0 0 8px;
	float: left;
	font-size: 1.1em;
 	color: #fff;
}
	
#user_navigation {
	font-size: 0.9em;
	z-index: 9999;
}

#user_navigation .photo {
	border: 1px solid #1d3652;
	margin: 2px 3px 0 0;
	height: 25px;
 	width: 35px;
 	float: left;
}
	
#user_info {
 	margin: 0 0 0 45px;
}
		
#user_navigation ul {
	font-size: 0.88em;
	margin-top: 4px;
}

#user_navigation ul a {
	color: #d5dde5;
}
			
#user_navigation ul#user_other {	
	margin-left: 5px;
}
			
#user_navigation ul#user_other li {
	float: left;
	padding: 0 4px;
}
	
#user_navigation ul#user_link_menucontent {
	background: #d5dde5;
	border: 1px solid #1d3652;
	margin-top: 0px;
	width: 180px;		
	z-index: 10000;
}

#user_navigation ul#user_link_menucontent li {
	padding: 1px;
	float: none;
}

#user_navigation ul#user_link_menucontent a {
	color: #1d3652;
	text-decoration: none;
	padding: 5px 5px 5px 15px;
	display: block;
}

#user_navigation ul#user_link_menucontent a:hover {
	background: #528f6c;
}
			
#user_navigation #user_link {
	background: #1d3652 url({ style_images_url }/th_bg.png) repeat-x 50%;
	border: 1px solid #1d3652;
	padding: 3px 20px 3px 10px;
	margin: 4px 0 0px 8px;
	min-width: 150px;
	-moz-outline: 0px;
	position: relative;
	display: block;
	overflow: hidden;
	float: left;
}

#user_navigation #user_link img {
	right: 5px;
	top: 8px;
	position: absolute;
}

#user_navigation.not_logged_in {
	font-size: 1em;
	padding: 8px 20px;
}

#user_navigation.not_logged_in a {
	margin: 0 10px;
}

/* End Edits */

Save and thats it!
Now if you wanna change colors, font colors, and such; that is up to you .

How to Add Category Icons

Sun, 14 Feb 2010 00:10:39 +0000

Removed because I guess I ripped erhen's tutorial.

I honestly never registered on his site until today (03/02/10) and the methods look the same and his css is more browser friendly.

I thought of adding icons when I purchased Mystic by Skinbox. He had forum icons and implemented it in category icons. I learned with the proper tag you can link to the forum or category id pretty easily.

I do not want be known as a ripper so again I apologize. I would have never done it if I knew there was another tutorial out there.

For everyone else you can view his tutorial here:
http://www.ipbforums...category-icons/

Remove content from PM emails

Mon, 08 Feb 2010 19:54:33 +0000

ACP -> Look & Feel -> Manage Languages -> English -> System -> public_email_content.

personal_convo_new_convo for new PM topics
Change new value to.

<#NAME#>,

<#POSTER#> has sent you a new personal conversation entitled "<#TITLE#>".

You can reply to this personal conversation by following the link below:

<#BOARD_ADDRESS#><#LINK#>

personal_convo_new_reply for PM replies.
Change new value to

<#NAME#>,

<#POSTER#> has replied to a personal conversation entitled "<#TITLE#>".

You can reply to this personal conversation by following the link below:

<#BOARD_ADDRESS#><#LINK#>

Show User Agent in Online List

Tue, 26 Jan 2010 15:38:32 +0000

Using this tutorial you can quickly identify new search engines accessing your site, or just see what kind of browser each of your members is using to visit the site.

Edit the Online List -> showOnlineList skin template. Find this code:

					
						( {$session['ip_address']} )

Add below:

					
{$session['browser']}

Save the template, and repeat for each skin.