HOW CAN I CONNECT PORTFOLIO TO MY OWN DATABASE

Step 1:

Create a MySQL/SqlServer/Oracle database and name it as you like (Note : Here I am going to explain on MySQL database server)

Step 2:

Create a table structure like below;

CREATE TABLE IF NOT EXISTS `tbl_gallery` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `gallery_type` varchar(255) DEFAULT NULL,
   `type` varchar(255) DEFAULT NULL,
   `sort_type` varchar(255) DEFAULT NULL,
   `img` varchar(255) DEFAULT NULL,
   `img_large` varchar(255) DEFAULT NULL,
   `title` varchar(255) DEFAULT NULL,
   `body` varchar(255) DEFAULT NULL,
   PRIMARY KEY (`id`)
 ) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Step 3:

Insert some dummy data to your database to use to test in next steps.

Download/View dummy data (.txt file) here

Step 4:

Open the file for edit "xml/gallery.php".

The content should look like this;

<root>
<?php
   header ("Content-Type:text/xml"); 

mysql_connect("localhost", "root", "") or die(mysql_error());
   mysql_select_db("incorporate") or die(mysql_error());

   $filter = addslashes(stripslashes($_GET["filter"]));

   $gallery_type = addslashes(stripslashes($_GET["gallery_type"]));

   $result = mysql_query("SELECT * FROM tbl_gallery_$gallery_type where 1=1".($filter=="" || $filter=="all"?"":" and type='$filter'")) or die(mysql_error()); 

   echo "<header><rowCount>".mysql_num_rows($result)."</rowCount></header>\n";

while($row = mysql_fetch_array( $result ))
   {
   ?>
<item type="<?php echo $row["type"];?>" id="<?php echo $row["id"];?>">
<img><?php echo $row["img"];?></img>
<imgl><?php echo $row["img_large"];?></imgl>
<h><?php echo $row["title"];?></h>
<txt><?php echo $row["body"];?></txt> 
</item>
<?php
   }
   ?>
</root>

Replace with this below (this one will help you, I think);

<root>
<?php
 header ("Content-Type:text/xml"); 
 
 $db_server = "localhost";
 $db_username = "root";
 $db_password = "";
 $db_name = "incorporate";
 
 mysql_connect($db_server, $db_username, $db_password) or die(mysql_error());
 mysql_select_db($db_name) or die(mysql_error());
 
 $filter = addslashes(stripslashes($_GET["filter"])); //are wee lookin what kind of elements? Photo, Motion, Web, etc...
 $gallery_type = addslashes(stripslashes($_GET["gallery_type"])); //which layout we gonna to use? 4column, 2column, 2column_gallery, etc...
 
 $result = mysql_query("SELECT * FROM tbl_gallery where 1=1".($filter=="" || $filter=="all"?"":" and type='$filter'")) or die(mysql_error()); 
 
 echo "<header><rowCount>".mysql_num_rows($result)."</rowCount></header>\n";
 
 while($row = mysql_fetch_array( $result ))
 {
 ?>
<item type="<?php echo $row["type"];?>" id="<?php echo $row["id"];?>">
<img><?php echo $row["img"];?></img>
<imgl><?php echo $row["img_large"];?></imgl>
<h><?php echo $row["title"];?></h>
<txt><?php echo $row["body"];?></txt> 
</item>
<?php
 }
 ?>
</root>

Then when you make a call on your own server like below;

http://localhost/incorporate/xml/gallery.php?filter=all&gallery_type=4column

You should able to see xml output like below;

Step 5:

Important : I want to make a note here. There is also another way to edit portfolio if would you like to use classic server side post/get methot. The file templates arranged under "static" directory.

Open this file : scripts/gallery/gallery.js and go to the line 87, the line 87 should look like this;

 url: 'xml/gallery.php?filter='+filter+'&gallery_type='+galleryType, //name of the file process your requests

Explanation of the given parameters above

filter : Type of the item that we want to show to user (Photo, Motion, Web, etc..)
gallery_type : Type of the gallery layout we want to get. (See the lines betwen 61-75 in gallery.js)

Until now we have created a database, created gallery table and added dummy data for "gallery4column" layout. Now we have to call our script to complete our work.

Step 6:

Open this file "portfolio_4column_gallery.html" and go to the line 49,

<!--gallery-->
<script type="text/javascript" src="scripts/gallery/gallery.js"></script>
<script type="text/javascript">
 $(document).ready(function(e) {
     $().incorporateGallery({
         galleryType:'gallery4column', //gallery type that we mentined before
         targetGalleryObject:$("#ajaxGalleryDiv"), //target object which we want to push dynamically generated html in (exists on the file as default)
         pagingWrapper:$(".paging-wrapper"), //target object which we gonna to put dynamic paging in (exists on the file as default)
         itemPerPage:8, //how many item we want to show on the page
         activePage:1, //you can ignore this, this will shows the first page as default when there is more page than one
         host:"http://"+window.location.hostname+":8080/" //feel free to change this as you wish, the path of your root
     });
 
     loadGallery('all'); //load all type of items as default
 });
 </script>
<!--/gallery-->

after ensure the lines below exist in your HTML file we have done well.

<div id="ajaxGalleryDiv" class="alignleft_block full-content-width"></div>
<!--content moved from here to static/4column_template.html-->
<div class="clear10"></div> 
<!--paging wrapper-->
<div class="paging-wrapper">
<!--content moved from here to static/paging_template.html-->
</div>
<!--/paging wrapper-->

Thats all.

Feel free to contact with us if have another question.

Regards.