Forums

[Plugin: Business Directory] Alternate styling of directory listings for 0.8.3 Beta (5 posts)

  1. btaz
    Member
    Posted 1 month ago #

    I wanted an alternative styling and additional information in the directory listing. Also I wanted to change the listing from using tables tags to div tags to make it easier to modify.

    I'm listing the changes below just in case someone else may want to try it as well. Sorry for the crude depiction but I thought it would be poor style to paste a URL to the blog. The listing looks as follows:

    ----------------------------------------------------------------------
    Some Business Name (Hyperlinked URL using a big font)
    Address line 1
    Address line 2

    Description ... lengthy text goes ...

    Phone: (555) 123-4567 Email: some-user@some-server.com
    Website: http://www.some-website.com
    ----------------------------------------------------------------------

    Note: Before attempting this please make sure to backup "main.css" and "functions.php". This will also be very helpful just in case you don't like the new look and feel. I tried to be as faithful to the original one as possible.

    ===================================================================================================
    File: main.css
    ===================================================================================================
    Find: .bizdir_linked_title {
    After: }
    Add:
    
    /*
    *  Alternate Directory Styles
    */
    div.bizdir_list {
    	width: 100%;
    }
    
    div.bizdir_list div.bizdir_listing {
    	border-bottom: 1px solid #999999;
    	padding-bottom: 0.6em;
    	margin-top: 0.6em;
    	margin-bottom: 0.6em;
    }
    
    div.bizdir_list div.bizdir_listing:hover {
    	background: #F0EADA none repeat scroll 0 0;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_title {
    	margin-bottom: 0.1em;
    	font-size: 1.3em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_title A:link,A:active,A:visited {
    	color: #000000;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_address {
    	font-size: 0.8em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_description {
    	margin-top: 0.4em;
    	font-size: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_contact {
    	font-size: 0.9em;
    	margin-top: 0.4em;
    	margin-bottom: 0.1em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_website {
    	font-size: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_website A:link,A:active,A:visited {
    	color: #000000;
    }
    
    ===================================================================================================
    File: functions.php
    ===================================================================================================
    Find: //Display Listings
    Delete all rows between:
        //Display Listings
    And:
        //Add Footer Pagination
    
    Add this after: //Display Listings
    	$directory .= "<div class='bizdir_list'>";
    	if(!empty($searchTerms))
    		$directory .=
    			"<div style='text-align:center;padding:5px 15px 10px 15px;'>".
    				"<b>Search results for: \"$searchTerms\"</b><br />".
    				"<small><a style='cursor:pointer;' onClick='bizdir_change_listings_page(0);'>View Entire Directory</a></small>".
    			"</div><hr/>"
    		;
    	foreach($listings as $l) {
    		$directory .=
    			"<div class='bizdir_listing'>".
    			"<div class='bizdir_title'>".
    				(empty($l["company_url"])?
    					str_replace("&Acirc;&","&",@$l["company_name"]):
    					"<a rel='nofollow' href='".$l["company_url"]."' target='_blank'>".
    						str_replace("&Acirc;&","&",@$l["company_name"]).
    					"</a>"
    				).
    			"</div>";
    		if(!empty($l->company_street1))
    			$directory .= "<div class='bizdir_address'>".@$l["company_street1"]."</div>";
    		if(!empty($l->company_street2))
    			$directory .= "<div class='bizdir_address'>".@$l["company_street2"]."</div>";
    		if(!empty($l->company_description))
    			$directory .= "<div class='bizdir_description'>"."<p>".str_replace("&Acirc;&","&",$l["company_description"])."</p>"."</div>";
    		$directory .= "<div class='bizdir_contact'>";
    		if(!empty($l->company_phone))
    			$directory .= "Phone: <strong>".@$l["company_phone"]."</strong> &nbsp; ";
    		if(!empty($l->company_email))
    			$directory .= "Email: <a href='mailto:".@$l["company_email"]."'>".@$l["company_email"]."</a>";
    		$directory .= "</div>";
    		if(!empty($l->company_url))
    			$directory .=  "<div class='bizdir_website'>Website: <a href='".str_replace("&Acirc;&","&",$l["company_url"])."' rel='nofollow'>".str_replace("&Acirc;&","&",$l["company_url"])."</a></div>";
    		$directory .= "</div>";
    	}

    http://wordpress.org/extend/plugins/business-directory/

  2. btaz
    Member
    Posted 1 month ago #

    Update with minor graphical improvement

    In main.css replace:

    div.bizdir_list div.bizdir_listing {
    	border-bottom: 1px solid #999999;
    	padding-bottom: 0.6em;
    	margin-top: 0.6em;
    	margin-bottom: 0.6em;
    }

    with:

    div.bizdir_list div.bizdir_listing {
            border-bottom: 1px solid #999999;
            padding-top: 0.6em;
            padding-bottom: 0.9em;
    }
  3. btaz
    Member
    Posted 1 month ago #

    Additional Improvements. The complete address is displayed, plus a link that opens up the address in a Google map.

    ----------------------------------------------------------------------
    Some Business Name (Hyperlinked URL using a big font)
    Address line 1
    Address line 2
    City
    State, ZIP

    Description ... lengthy description text is shown here ...

    Phone: (555) 123-4567 Email: some-user@some-server.com (Show on map)
    Website: http://www.some-website.com
    ----------------------------------------------------------------------

    Note: Before attempting this please make sure to backup "main.css" and "functions.php". This will also be very helpful just in case you don't like the new look and feel. I tried to be as faithful to the original version as possible.

    ===================================================================================================
    File: main.css
    ===================================================================================================
    Find: .bizdir_linked_title {
    After: }
    Add:
    
    /*
    *  Alternate Directory Styles
    */
    div.bizdir_list {
    	width: 100%;
    }
    
    div.bizdir_list div.bizdir_listing {
    	border-bottom: 1px solid #999999;
    	padding-top: 0.6em;
    	padding-bottom: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing:hover {
    	background: #F0EADA none repeat scroll 0 0;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_title {
    	margin-bottom: 0.1em;
    	font-size: 1.3em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_title A:link,A:active,A:visited {
    	color: #000000;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_address {
    	font-size: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_description {
    	margin-top: 0.4em;
    	font-size: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_contact {
    	font-size: 0.9em;
    	margin-top: 0.4em;
    	margin-bottom: 0.1em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_contact A:link,A:active,A:visited {
    	color: #000000;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_website {
    	font-size: 0.9em;
    }
    
    div.bizdir_list div.bizdir_listing div.bizdir_website A:link,A:active,A:visited {
    	color: #000000;
    }
    ===================================================================================================
    File: functions.php
    ===================================================================================================
    Find: //Display Listings
    Delete all rows between:
        //Display Listings
    And:
        //Add Footer Pagination
    
    Add this after: //Display Listings
    
    	$directory .= "<div class='bizdir_list'>";
    	if(!empty($searchTerms))
    		$directory .=
    			"<div style='text-align:center;padding:5px 15px 10px 15px;'>".
    				"<b>Search results for: \"$searchTerms\"</b>".
    				"<small><a>View Entire Directory</a></small>".
    			"</div><hr/>"
    		;
    	foreach($listings as $l) {
    		$directory .=
    			"<div class='bizdir_listing'>".
    			"<div class='bizdir_title'>".
    				(empty($l["company_url"])?
    					str_replace("&Acirc;&","&",@$l["company_name"]):
    					"<a rel='nofollow' href='".$l["company_url"]."'>".
    						str_replace("&Acirc;&","&",@$l["company_name"]).
    					"</a>"
    				).
    			"</div>";
    		if(!empty($l->company_street1))
    			$directory .= "<div class='bizdir_address'>".@$l["company_street1"]."</div>";
    		if(!empty($l->company_street2))
    			$directory .= "<div class='bizdir_address'>".@$l["company_street2"]."</div>";
    		if(!empty($l->company_city))
    			$directory .= "<div class='bizdir_address'>".@$l["company_city"]."</div>";
    		if(!empty($l->company_state) || !empty($l->company_zip))
    			$directory .= "<div class='bizdir_address'>".@$l["company_state"]." ".@$l["company_zip"]."</div>";
    		if(!empty($l->company_description))
    			$directory .= "<div class='bizdir_description'>"."<p>".str_replace("&Acirc;&","&",$l["company_description"])."</p>"."</div>";
    		$directory .= "<div class='bizdir_contact'>";
    		if(!empty($l->company_phone))
    			$directory .= "Phone: <strong>".@$l["company_phone"]."</strong> &nbsp; ";
    		if(!empty($l->company_email))
    			$directory .= "Email: <a href='mailto:".@$l["company_email"]."'>".@$l["company_email"]."</a> &nbsp; ";
                    if(!empty($l->company_city) && !empty($l->company_state) && !empty($l->company_street1))
    			$directory .= "<a rel='nofollow' href='http://www.google.com/maps?q=".@$l["company_street1"]."+".@$l["company_city"]."+".@$l["company_state"]."+".@$l["company_country"]."'>"."(Show on map)"."</a>";
    		$directory .= "</div>";
    		if(!empty($l->company_url))
    			$directory .=  "<div class='bizdir_website'>Website: <a href='".str_replace("&Acirc;&","&",$l["company_url"])."' rel='nofollow'>".str_replace("&Acirc;&","&",$l["company_url"])."</a></div>";
    		$directory .= "</div>";
    	}
  4. mattlongman
    Member
    Posted 1 day ago #

    Thank you btaz, that's really useful!!

  5. btaz
    Member
    Posted 1 day ago #

    I'm happy it worked. I haven't upgraded to 0.8.4 yet. Did you use it with 0.8.3 or 0.8.4?

Reply

You must log in to post.

About this Topic