ncoded contact information

website design services web design service online shops service optimisation and seo services graphical design servicese-commerce service search engines services graphic design services

Archive for May, 2009

Creating Wordpress Sidebars with Submenus

Posted by admin On May - 15 - 2009

If you take a look at this website you will notice that each category has its own ‘menu block’ and within each menu block is listed the sub-categories. This tutorial we explain how you can implement this on you own WordPress website or blog.

Introduction:

The first thing that you need to establish is which sidebar you want to edit; This isn’t as clear as it could be as it is up the theme designer to setup which sidebars are used.

For this example we will assume you have 3 side bars, named sidebar.php, sidebar1.php and sidebar2.php - sidebar has full width, sidebar1 is half sized and is formatted to the left hand side, and sidebar2 is formatted to the right hand side. 

To get a clearer idea of this, just take a look at the sidebars used on this website, as these follow this convention.

Getting started:

For this tutorial we will just change one sidebar, but the procedure can be used on any sidebar - in this case we will be editing side1.php - which is the 1/2 formatted left hand side sidebar.

*Normally (see note above about theme designers choice of how to implement and position sidebars) the following code will be used to create a ‘menu’ block which displays ALL the categories you have, including both root and sub categories.

<?php //wp_list_categories('orderby=name&show_count=0&title_li=<h2>Article Categories</h2>'); ?>
<?php //endif; ?>

Explanation:

As you can see this functionality is achieved by calling the WP API function wp_list_categories(), passing it 3 argument parameters. The first one sets how the returned categories are ordered, the second sets if you want a count to be displayed (0=false, 1=true), with the third set how you want the title to display.

Required design:

Now if you consider what we require, instead of just one category listing with ALL categories - instead what we require is one ‘menu block’ per category, name as the root or parent category with all the sub categories below.

Implementation:

The code below implements this functionality via calling the same function above multiple times, but in each case limiting the sub categories being returned (as well as excluding the display of the root or parent category).

<?php wp_list_categories('orderby=name&show_count=0&use_desc_for_title=0&child_of=6&title_li=<h2>Online Tutorials</h2>'); ?>
<?php wp_list_categories('orderby=name&show_count=0&use_desc_for_title=0&child_of=3&title_li=<h2>Open Web Designs</h2>'); ?>
<?php wp_list_categories('orderby=name&show_count=0&use_desc_for_title=0&child_of=27&title_li=<h2>Open Software</h2>'); ?>
<?php wp_list_categories('orderby=name&show_count=0&use_desc_for_title=0&child_of=4&title_li=<h2>Modules Addons</h2>'); ?>
<?php wp_list_categories('orderby=name&show_count=0&use_desc_for_title=0&child_of=5&title_li=<h2>Themes Templates</h2>'); ?>
<?php endif; ?>

So if you need to split you master categories into ‘menu blocks’ displaying each category and it sub categories - then this is how to do it! simple huh!?

  • Share/Save/Bookmark

Drag n Drop to Google Docs

Posted by admin On May - 15 - 2009

If you use Google docs quite a bit then it can often become frustrating having to login and upload files.

However, Google has put together a very useful desktop application (built with .net) that allows you to drag and drop files straight into you Google docs account; useful huh?

As a sample application it also gives you full access to the source code so that you can modify it and rebuild the application.

You read more about this application as well as download the sourcecode and application from here:

 http://code.google.com/support/bin/answer.py?answer=86805&topic=12022

  • Share/Save/Bookmark

Manually Disabling Wordpress Plugins

Posted by admin On May - 15 - 2009

If you need to uninstall (eg disable) a recently installed plugin, perhaps because it has stopped your wordpress (WP) site from working then just use the following example.

Enter you domain control panel (cpanel, plesk, etc) and open phpMyAdmin (or any other database management system DBMS).

Select (click) the name of the database that corresponds to your WP installation; if you’re using CPanel then it usually takes the form of:

[cpanel_username][wdrp]

Once you have the correct Database table showing, then click on the table wp_options find the row active_plugins, click on the pencil icon to edit this value (if you’re using PHP-MyAdmin)

You will see something similar to the following, depending on the number and type of plugins you have installed:

a:3:{i:0;s:19:”akismet/akismet.php”;i:1;s:23:”wp-photo-album/wppa.php”;i:2;s:37:”wp-shopping-cart/wp-shopping-cart.php”;}

That entire array of code represents every active plugin on your site. Thus, to quickly disable all plugins without using the WP Admin area, highlight the entire block of code, cut it out, and paste it into a safe, offline text file. After removing the code, click the button to save your changes and that’s it.

All WordPress plugins are now deactivated (yet still installed, and with all plugin options intact). You can go through and reactivate all the plugins except the one that was causing you problems.

  • Share/Save/Bookmark

ECommerce Automated Product Inserts Uploads

Posted by admin On May - 15 - 2009

If you own an e-commerce store and have more than a few hundred products then you will soon be faced with a dilemma; who and when exactly will all the products be entered in to my e-commerce shop!?

As an analysis, a typist with a typing speed of 65 words per minute, will complete on average around 100 products per day (taking into account file naming, image cropping, writing a short product description, as well as text and content formatting).

Therefore if you have say 5,000 products, then in order to get these online correctly and in a professional effective manner, will take 5000 / 100 = 50 days, or nearly 2 months.

And don’t forget, that’s a 65WPM typist; you’re average Joe would do around a 1/3 of these (hence it would take around 150 days or 6 months to upload or insert all your products).

So clearly a method is needed in order to automate this process based on say a product list (as a .CSV file aka comma delimited text file).

Your products.CSV file:

The purpose of your .csv file is store the products information in order that it can be put into your e-commerce database. Obviously you would this to be created dynamically, but a static file will also do just fine (especially if you want to update multiple databases with the same ‘dataset’).

So create this file, making a note of which fields contain which data, eg field[1] has product_id code, etc. That’s this step complete now.

Automated Upload Code
The last thing we need to do is read the file and then insert the product information as products into our e-commerce store autonomously. In order to do this you will need to first find out which db fields are expected, both in terms of names, size and type, and order.

Once we have these we can then just read our products.csv file into a PHP array, and then loop through writing each product at a time; please note that in 99% of all cases this equates to creating new records in more than one database table. Normally you will need to add the product, product description, as well as any other related tables.

Data Dictionary & ER Diagram

Clearly in order to perform the above you will need access to your e-commerce store’s data diagram or ER diagram so that you can see how each table is related to another within the database. One of the quickest way in order to get this is to use the data dictionary function within PHPMySQL

So the 2 steps above logically layout how you can automate your product uploads in to your e-commerce store. At a later date we will write a specific version of this tutorial, with code and files, for both Magento and OSCommerce as this is something that we have lately completed successfully.

  • Share/Save/Bookmark

When creating or modify databases and their tables, it is essential that you understand how the tables relate, or how you want them to relate. Normalization is the process whereby tables are optimised via referential integrity to remove duplication, redundancy, and errors.

Two key ways to represent the fields, tables, and relationships is via ER (Entity-Relationship) Diagrams and Data Dictionaries. The ER Diagram is just that; a diagram (similar to a UML Class or Object diagram) which shows the tables and their data fields, as well as the relationship between tables.

The Data Dictionary is listing of the formatting  used to create you tables - eg relationships are viewed as Primary and Foreign keys etc. All the tables and their fields and formatting, as well as the Table Relationshops are also fully documented.

The ER Diagram is useful for taking a High Level view of the overall database including Relationships, where as the Data Dictionary is Essentially as it gives you key specific data - such as the field type, size, length, etc.

  • Share/Save/Bookmark

Google Chatback Live Support

Posted by admin On May - 15 - 2009

The following is taken from the Google Chat back page; As you can see the information is clear and intuitive.

A Google Talk chat back badge will let visitors to your web page chat with you. They’ll be able to chat with you whenever you’re signed in to Google Talk [under your Google Account log-in] For more information, visit the help center.

Each time you visit this page, we generate a new badge for you so you can use badges with different settings on different web pages. For example, you can share your status message on your personal blog and not on your public blog. To change a badge later, just return to this page and get a new one.

You just build a chatback widget (eg badge) and then display it on your website. When you logged into Google it will automatically establish a Live chat system via Google chat back (eg messagener)

Google Chatback Demo

The below is a real live demo (where we are always offline!)

  • Share/Save/Bookmark

The NYTimes Reader (News Desktop)

Posted by admin On May - 15 - 2009

We always like it when a large news organisation such as the New York Times utilise new technology and release free media players (especially those that use RIA technologies such as Adobe Air or Flex).

nytimesreader

This desktop application is a fairly unique concept of streaming newspaper services into a PDF on the desktop (eg Adobe Air). Its from the New York Times and its called, obviously,  the Times Reader.

“It reads like a newspaper. Updates like a Web site. And delivers like The New York Times. The new Times Reader 2.0 delivers the entire day’s Times in seconds, so you can carry it wherever you go.”

Adobe Air Installation

In order to use this application you are going to have to install Adobe Air - which is basically the desktop version of Adobe Flex - both of which are very useful as more and more key players are developing media (RIA) applications; Just work through the dialog boxes installing everything as default.

As you can see it really it really is the NYT (USA edition, you could say), very useful for non-US residence for viewing on how ‘they are being represented in foreign news outlets’.

You can download the NYTimes Reader Software for free.

  • Share/Save/Bookmark

Create an Adobe Flex & Air Application Video Tutorial

Posted by admin On May - 15 - 2009

This is an excellent video tutorial on how to build an Adobe Flex web application (RIA). As you can see Adobe Flex and Air are the same beast, the difference being where they are aimed at, the desktop or browser flash player.

Flex is a highly productive, free open source framework for building and maintaining expressive web applications that deploy consistently on all major browsers, desktops, and operating systems. While Flex applications can be built using only the free open source framework, developers can use Adobe® Flex® Builder™ software to dramatically accelerate development.

http://www.adobe.com/products/flex/media/flexapp/

  • Share/Save/Bookmark

PHP 5 Web Page Scraping

Posted by admin On May - 15 - 2009

If you want to scrape or mash-up elements from an external website then take a look at the following code.

As you can see it fetches the document (web pages) and then iterates around via DOM and SimpleXML.

$html = @DOMDocument::loadHTMLFile($url); // fetch the remote HTML file and parse it (@ suppresses warnings).
$xml = simplexml_import_dom($html); // convert the DOM object to a SimpleXML object.
foreach ($xml-&gt;xpath('//a') as $node){ // run an XPath query and iterate through the array of results
  print (string) $node . &quot;\n&quot;; // casting to string produces the text contents of the node.
  print $node['href'] . &quot;\n&quot;; // attributes of the node are accessible as array attributes.
  print $node-&gt;asXML() . &quot;\n\n&quot;; // asXML() produces the whole XML string.
}

Note: if namespaces are involved, use

$xml-&gt;registerXPathNamespace('NAMESPACE_PREFIX', 'NAMESPACE_URI');

and

$xml-&gt;xpath('//NAMESPACE_PREFIX:ELEMENT')

replacing the text in capitals as appropriate.

  • Share/Save/Bookmark

How to Embed Flickr SlideShows

Posted by admin On May - 15 - 2009

If you want embed Flickr slideshows into your website then take a look at the following code which allows you to do this.

IFrame solution:

&lt;iframe align=center src=http://www.flickr.com/slideShow/index.gne?user_id=2468@N00&amp;amp;tags=NframeBorder=0 width=500 scrolling=no height=500&gt;&lt;/iframe&gt;

Object Solution:

&lt;object type=&quot;text/html&quot; data=&quot;http://www.flickr.com/slideShow/index.gne?user_id=2468@N00&amp;amp;tags=N&quot; width=&quot;500&quot; height=&quot;500&quot;&gt; &lt;/object&gt;

Where ever you want the slideshow to appear just place the following html code; obvoulsy you will also have to change the user_id to the correct one. Also if you need to resize the screenshow just update the correct paraments (arguments).

If you are using Tags, then also replace N with the correct tag that you want to use.

The following arguments (or paramenters) are also available for useage:

contacts=
text=
tag_mode=
favorites=
group_id=
frifam=
nsid=
single=
firstIndex=
set_id=
firstId=

You can get full infomation about this from the Flickr API (application programming interface).

  • Share/Save/Bookmark
Website & E-Commerce Solutions


nCoded Website, IP & Content © 2003 - 2009 nCoded - All Rights Reserved - No part of this website may be reproduced without permission.