indexu.com

SMTP mail doesn’t work

dody — Wed, 30 Jun 2010 05:06:39 +0000

Indexu use phpmailer class to send email. By default it use mail() function. Inside admin panel, there is an option to switch to use SMTP instead if mail().

Phpmailer use socket connection to connect to SMTP mail server. So before you use it, make sure your webhost allow fsockopen() function. It this function is disabled, then email won’t be sent.

Custom category listing in browse.html

dody — Sun, 20 Jun 2010 00:13:02 +0000

In earlier post, I show you how to create custom category listing in front page. Now will show you how to create custom category listing in category pages (browse.html). The real challenge here is to construct the category path as we are deep inside category level.

First, you need to remove this tag from browse.html

<%$category%>

Then replace with the following codes

<%php%>
  global $dbConn, $indexu, $cat;
 
  $img_path = $indexu->config['site_url'].'/themes/'.$indexu->config['active_theme'].'/cat';
 
  $query = "select category_id, name, image
            from idx_category
            where parent_id = '$cat'";
  $result = $dbConn->Execute($query);
 
  $limit = $result->RecordCount();
  $i=0;
 
  while ($row = $result->FetchRow()) {
    $i++;
 
    // here we construct the category url, need to fetch the parents
 
    $parents = $dbConn->Lookup('parents', 'idx_category_path', "category_id = '{$row['category_id']}'");
    $arr = explode(';',$parents);
    array_pop($arr);
    array_pop($arr);
    array_shift($arr);
    array_reverse($arr);
 
    unset($path);
 
    foreach ($arr as $k => $v) {
      $name = $dbConn->Lookup('name', 'idx_category', "category_id = '$v'");
      $path .= SEOReplace($name).'/';
    }
 
    $url = $path.SEOReplace($row['name']).'/';
    print "<div class='subList'><a href='$url'>{$row['name']}</a></div> \n";
  }
<%/php%>

Language code, add .utf8 if it doesn’t work

dody — Fri, 18 Jun 2010 09:26:04 +0000

Usually language code is constructed like es_ES or fr_FR. However in some servers, usually on linux box, the server locale code need explicitly add .utf8. So if you have problem with strange characters where utf8 doesn’t work. Do the following steps:

1) rename the language folder, add .utf8.

/lang/es_ES.utf8
/lang/fr_FR.utf8

2) language switching also need to be modified to:


http://www.nicecoder.com/testrial/upload/set_language.php?lang_id=es_ES.utf8&back=/testrial/upload/

Notice that it is now become lang_id=es_ES.utf8.

Setting up new mysql database with cpanel

dody — Tue, 15 Jun 2010 22:06:24 +0000

Today I will show you a basic instruction how to setup a new mysql database for your indexu directory by using cpanel.

1) Open cpanel page, usually something like www.domain.com:2082, then enter your username and password that are provided by your hosting account.

2) Click on manage mysql database

3) Create a new mysql database

4) Create a new user name. Enter username and password.

5) Before you can use the database, you need to assign user to get access the database

6) Give the user all privilege

That’s it. Now you have mysql ready to use with indexu. Form this example it will be:
MYSQL username: indexute_dody
MYSQL password: poi0982
MYSQL host: localhost
MYSQL database name: indexute_indexudir

Show listing in two columns or more

dody — Tue, 15 Jun 2010 02:15:38 +0000

Bored to have listing in single column? I will show you how to make listing in multiple columns.

Edit rows.html, clean the codes and replace with:

  <%if $number % 2 eq 1%>
    <div class="row_nl">
  <%/if%>
 
  <div class="row_item myrow">
    <img src="http://open.thumbshots.org/image.aspx?url=<%$url%>" alt="<%$title%>" style="border:1px solid #777;">
    <h3><a href="<%$url%>" name="link_<%$link_id%>"><%$title%></a></h3>
    <p><%$description%></p>
    <p><a href="<%$url%>" name="link_<%$link_id%>"><%$url%></a> - <a href="<%$site_url%>/<%$detail_page_url%>"><%t%>details<%/t%></a></p>
    <p>Google PR <img src="<%$site_url%>/googlepr.php?link_id=<%$link_id%>" alt="" /></p>
  </div>
 
  <%if $number % 2 eq 0%>
    </div>
  <%/if%>

Then add these 2 css classes to construct the layout.

.row_nl {
  clear:both;
  width:100%;
  margin-bottom: 10px;
}
 
.row_item {
  margin-right:10px;
  display:inline;
  width:285px;
  float:left;
}

Show category listing as list of images

dody — Mon, 14 Jun 2010 07:47:48 +0000

In this tutorial I will show you how to create an alternative category listing in front page where the categories will be listed as a series of images.

1) Prepare the image files. Create a folder called ‘cat‘ in template folder. Then put the images files here.

2) Edit category image file for each categories with admin panel or phpmyadmin. Put the filename of image file you have prepared for each categories.

3) Edit index.html, add the following code where you want to put this category list.
You can change $item_per_row value as you desire.

<%php%>
  global $dbConn, $indexu;
 
  $item_per_row = 4;
 
  $img_path = $indexu->config['site_url'].'/themes/'.$indexu->config['active_theme'].'/cat';
 
  $query = "select name, image
            from idx_category
            where parent_id = '0'";
  $result = $dbConn->Execute($query);
 
  $limit = $result->RecordCount();
  $i=0;
 
  while ($row = $result->FetchRow()) {
    $i++;
 
    if ($i % $item_per_row == 1) {
      print "";
    }
 
    $url = SEOReplace($row['name']).'/';
    print "
           $img_path/{$row['image']}' title='{$row['name']}' alt='{$row['name']}' />
";
 
    if ($i % $item_per_row == 0 || $i==$limit) {
      print "
";
    }
  }
<%/php%>

4) Add the following css classes into css file, usually style.css

.cat_nl {
  clear:both;
  width:100%;
  margin-bottom: 10px;
}
 
.cat_item {
  margin-right:10px;
  display:inline;
}

Adding dynamic gmap with navigation and zooming

dody — Mon, 14 Jun 2010 00:34:12 +0000

As many of you request how to replace the static gmap image with dynamic gmap which allow navigation and zooming, I made some test how to do this for the easiest way.

Ok. This is the easiest way. We only need to change the template files. Actually only 2 files.

Edit header.html, usually we use

<body>

but now we need to add onload call to js to load gmap only when detail page is accessed.

<%php%>
global $page_identifier;
 
if ($page_identifier=='detail.php') {
  print '';
}
else {
  print "";
}
<%/php%>

Edit detail_link.html, add the div container to show the map, it must have id gmapnav_canvas.

<h3>Location Map</h3>
<div id="gmapnav_canvas" style="width: 640px; height: 400px;text-align:center;margin: 20px;"></div>

Next, the last step is to construct the js code for google map. Edit detail_link.html, you can put the code at the of this file.

<%php%>
 
  $api_key = "";
 
  global $dbConn;
  $query = "select * from idx_link where link_id = '{$_REQUEST['linkid']}' limit 1";
  $result = $dbConn->Execute($query);
 
  $address  = $result->Fields("address");
  $city  = $result->Fields("city");
  $zip  = $result->Fields("zip");
  $state  = $result->Fields("state");
  $country  = $result->Fields("country");
 
  $loc = urlencode("$address, $city, $state, $zip, $country");
 
  $api_req = 'http://maps.google.com/maps/geo?q='.$loc.'&key='.$api_key.'&sensor=false&output=csv';
 
  $api_result = file_get_contents($api_req);
  $arr = explode(',',$api_result);
 
  if ($arr[0]=='200') {
    $latlng = $arr[2].','.$arr[3];
 
    $gmap_js = "
    
    
    ";
  }
 
  print $gmap_js;
<%/php%>

Convert md5 password

dody — Sat, 12 Jun 2010 23:33:35 +0000

In indexu 5.x the password is stored in plain text.
If you upgrade from indexu 5.x to indexu deluxe, the installer will convert it automatically to md5.

If you experience user can not login after upgrade, then it could be that the conversion process fail.
If you have this problem, here is a solution.

Create a file called convertmd5.php


include "application.php";
 
if ($_REQUEST['c']) {
  ConvertMD5password();
}
else {
  print "Do you want to convert user password to MD5? 

         Make sure that the password is not in MD5
         Convert now
";
}
 
function ConvertMD5password(){
  global $dbConn;
 
  $result = $dbConn->Execute("select * from `idx_users` where length(password) <30");
  while (!$result->EOF) {
    $dbConn->Execute("UPDATE `idx_users` SET `password` = '".md5($result->Fields("password"))."' WHERE `username` = '".$result->Fields("username")."'");
    $result->MoveNext();
  }
 
  return true;
}
?>

Upload this file to indexu root folder, then run with browser.
After it is done, you need to delete this file for security.

How to make slider work for your template

dody — Fri, 04 Jun 2010 07:07:20 +0000

Indexu use stepcarousel.js for image slider. I realize that the slider need to be customized for each template.
Here is some direction how to make it work for any templates you want.

1) Check your header.html file, make sure you have base tag and jquery loaded. Here is my html head section to start:

  <link href="<%$tpl_base%>/jquery.autocomplete.css" rel="stylesheet" type="text/css" media="screen" charset="utf-8">
	<%foreach from=$additional_js key="name_js" item="file_js" name="addition_js"%>
    <script type="text/javascript" src="<%$file_js%>"></script>
  <%/foreach%>
  <script type='text/javascript' src='<%$tpl_base%>/jquery.js'></script>
  <script type='text/javascript' src='<%$tpl_base%>/jquery.autocomplete.min.js'></script>
 
	<script type="text/javascript">
  jQuery(document).ready(function($){
    $("#keyword").autocomplete("<%$site_url%>/autocomplete.php?mode=link");
  });
	</script>
 
  <base href="<%$site_url%>/" />

2) In index.html, call the slider block.

<%block_slide max_item="20"%>

3) Open /blocks/block.slider.html, notice the slider parameter and there are important html class: slideshow and stepcarousel. Later you will need to set the css width of these class. Also make attention with navigation button (left/right) defaultbuttons, you may want to replace the image and adjust the position.

<%if $link%>
    <script type="text/javascript" src="<%$tpl_base%>/stepcarousel.js"></script>
    <script type="text/javascript">
 
    stepcarousel.setup({
      galleryid: 'mygallery', //id of carousel DIV
      beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
      panelclass: 'panel', //class of panel DIVs each holding content
      autostep: {enable:true, moveby:1, pause:2000},
      panelbehavior: {speed:500, wraparound:true, persist:true},
      defaultbuttons: {enable: true, moveby: 1, leftnav: ['<%$tpl_base%>/images/play_l.png', -5, 35], rightnav: ['<%$tpl_base%>/images/play_r.png', -20, 35]},
      statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
      contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
    })
 
    </script>
<%$hook_html_block_slide_begin%>
				<div class="content_box_full slideshow">
        <div id="mygallery" class="stepcarousel">
            <div class="belt">
	<%$link%>
            </div>
          </div>
					<div class="clear"></div>
				</div>
 
 
<%$hook_html_block_slide_end%>
<%/if%>

4) Open /blocks/block.slider_row.html, you may want to customize something here. In most case, just leave it as it is.

<%$hook_html_block_slide_rows_begin%>
 
  <div class="panel">
    <a href="<%$site_url%>/<%$detail_page_url%>" name="link_<%$link_id%>"><img src="http://open.thumbshots.org/image.aspx?url=<%$url%>" alt="<%$title%>"></a>
  </div>
 
<%$hook_html_block_slide_rows_end%>

5) Now you need to customize the css, you can use main.css, add and adjust the following css code to suit your need. Usually you need to change .slideshow width and .stepcarousel width.

.slideshow {
  background: #ddd;
  width:570px;
}
 
.stepcarousel{
  position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  width: 555px; /*Width of Carousel Viewer itself*/
  height: 115px; /*Height should enough to fit largest content's height*/
  margin: 5px;
  margin-top:0;
}
 
.stepcarousel .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}
 
.stepcarousel .panel{
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 10px; /*margin around each panel*/
  width: 120px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
 
.stepcarousel .panel img {
  padding: 2px;
  background: #fff;
}

6) Check your template root folder to have needed js files: jquery.js and stepcarousel.js.

Show uploaded image from image custom field

dody — Fri, 04 Jun 2010 06:11:51 +0000

With custom field, you can have a new data field with image type. In add and modify link form the field will be added automatically.

To show the uploaded image in the listing page and detail page, you need to add the following code in template file: rows.html for listing and detail_link.html for detail page.

<img src="<%$theimage%>" />

Change <%$theimage%> with custom field name you have.