Designer Sandbox

How to Create a Joomla! 2.5 QuickStart Package

Vincent — Tue, 08 May 2012 05:28:43 +0000

Joomla! 2.5 QuickStart Package is very easy to achieve. Joomla! QuickStart Tutorial. This tutorial will teach you how to quickly package your Joomla! site in minutes. This tutorial is best for Joomla! template designer or Joomla template developer. Also if you would like to move your site to a different server, this is the best way to do it. Basically this act as a backup of your site.

What we need to start:

Latest version of Joomla!.
All files from your own Joomla! site that you wan to package.
mysql database dump of your site.
Compression tool e.g Winrar, winzip, stuffit

Procedure:
Step 1
Create an empty folder and name it to whatever you like e.g ‘Joomla quickstart package’.

Step 2
Copy all the files from your own Joomla! site that you want to package. You can use a ftp agent to download your package. I would suggest to use filezilla, because there’s over 10,000 files. You will definitely need to know if all the file came through.

Step 3
Delete the configuration.php file

Step 4
Unzip the Original Joomla! quickstart package where you can obtain here.

Step 5
Copy the installation directory from the Joomla! quickstart package that you had just unzip.

Step 6
Get the mysql dump of your database and rename the file to ‘sample_data.sql’. If you only want data, you will do a data dump. But if you have extra components, modules, and plugins. You will want to export along with data structure.
a) Select your joomla tables

b) Click on the Export tabs on the top

c) Click on the Custom radio button. Make sure you had “Select All” table, click on the structure and data radio button, and be sure to Add DROP TABLE / VIEW / PROCEDURE / FUNCTION / EVENT statement.

d) Find and replace your database prefix to #__. gjdok_ should be your own prefix.
Find gjdok_
Replace with #__

Step 7
Open the sql file you had just export. Now do a search for where you look for
`gjdok_users` replace the gjdok_ to your own prefix
You will now see the following code.

INSERT INTO `gjdok_users` (`id`, `name`, `username`, `email`, `password`, `usertype`, `block`, `sendEmail`, `registerDate`, `lastvisitDate`, `activation`, `params`) VALUES
(42, 'Super User', 'admin', your@email.com', '', 'deprecated', 0, 1, '2012-02-08 06:19:17', '2012-05-08 03:08:58', '', '{}');

If the quickstart package are for development use, where you share this to others. You will need to delete the following like below.

Step 8
Open up your own ‘Joomla quickstart package’ and go inside your installation folder
installation > sql > mysql > sample_data.sql
Replace the sample_data.sql with the one you had just export.

Step 9
Compress (zip) the folder ‘Joomla quickstart package’ Compression tool e.g Winrar, winzip, stuffit

Now, this is all you need to do, to package a Joomla! 2.5 QuickStart Package.
Joomla! 2.5 QuickStart Package Tutorial DONE.

When trying to save your menu item in Joomla! 2.5 – Save failed with the following error: JTableMenu: _getNode Failed

Vincent — Fri, 04 May 2012 07:07:15 +0000

When you started your Joomla 2.5 package, if you start your package with empty content while you install.
You may run into this situation. You are not able to create new menu item.

When you try to save your menu item, you will get this message.

Save failed with the following error: MenusTableMenu: :_getNode Failed –

The Problem: The issue is that in the menu table the record with id = 1 is missing and not migrated over. This record is important to the creation of new menu items.

The Solution: Add the record back into the database.

For example:

My database name = MyJoomlaDatabase
My prefix is = mjd17_

Follow the steps below to fix this Joomla error message:

Login to your webhosting control panel.
Click on the phpMyAdmin, login to your database
Click on the SQL tab
Copy the query below and paste it in the textbox. REPLACE the database name and prefix in italics with your own.
5. Click on the ‘GO’ button.

INSERT INTO `DATABASE_NAME`.`c7gzy_menu` (`id` ,`menutype` ,`title` ,`alias` ,`note` ,`path` ,`link` ,`type` ,`published` ,`parent_id` ,`level` ,`component_id` ,`ordering` ,`checked_out` ,`checked_out_time` ,`browserNav` ,`access` ,`img` ,`template_style_id` ,`params` ,`lft` ,`rgt` ,`home` ,`language` ,`client_id` ) VALUES ( '1', '', 'Menu_Item_Root', 'root', '', '', '', '', '1', '0', '0', '0', '0', '0', '0000-00-00 00:00:00', '0', '0', '', '0', '', '0', '0', '0', '*', '0')

Centering a div block without the width using pure CSS (All Browser)

Vincent — Thu, 26 Jan 2012 09:32:13 +0000

Easiest way to centering a div using pure CSS

The trick to center the div is to shift the outer and inner div, with the use of position:relative and display:block. Shift the outer block 50% left relative, and then next is to move the inner block back to -50% left. Hope this make sense. This code will work on all browser.

DEMO

html


    
        
            Centering the DIV

css

.ds {
    margin:0;
    padding:0;
}
div.wrapper{
    float: left;
    overflow: hidden;
    position: relative;
    width: 100%;
    background:#00F;
    padding:10px;
    margin:0 -20px;
}
div.outer{
    clear: left;
    float: left;
    left: 50%;
    list-style: none outside none;
    margin: 0;
    padding: 0;
    position: relative;
    text-align: center;
}
div.inner{
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    position: relative;
    right: 50%;
    color:#FFF;
    padding:5px 20px;
    background:#900;
    border:1px dotted #cccccc;
}

20 Incredibly Free Web and Sans Serif Fonts

Vincent — Thu, 01 Dec 2011 10:41:04 +0000

Tools and Tips for everyday web designing – Web Resolution and Size

Vincent — Thu, 01 Dec 2011 08:17:23 +0000

Designing for the Web: Resolution and Size

To design a proper website, first you will need to know the resolution and size you are heading toward. Here are some article to stronger your knowing.

Designing for the Web: Resolution and Size by Felix Mak

Best Screen Resolution to Design Websites by hobo-web.co.uk

Optimal Screen Resolution for Web Design (2010 Update) by Mark Thompson in Design/Development

Designing for the Web by Joshua David McClurg-Genevese

Screen Resolution And Page Design by Larisa Thomason

POLYGONAL PORTRAITS by FEEL DESAIN

Vincent — Sun, 27 Nov 2011 07:08:35 +0000

This is some amazing design, love this poly project by feeldesain.
To see more of this amazing art, you can view the original post by clicking here.
Original Post by feeldesain

No Related Posts

3 Professional Free Online Project Manger Tools

Vincent — Sat, 26 Nov 2011 03:39:34 +0000

Freedcamp

This is absolutely awesome! Compare to other project management tools out there Freedcamp is one of the easiest one ever, and with https enable all the way I am 100% happy with the security they had offered.

Freedcamp offers an extremely easy, yet fully customizable user permission system. Choose what your co-workers and clients can see, or create a custom group to manage permissions. Each application can be separately managed allowing you to track each and every user role.

Receive instant notifications of everything happening within Freedcamp. Reply to email notifications directly from your inbox. Receive SMS alerts about newly created items or modifications to existing ones. With the ability to customize the level of notifications, you will receive just the right amount of information.
Freedcamp

Open Atrium

This is an project management tools that you can run on your own server. If they don’t have the module that you are looking for, you can build upon it.

Open Atrium is an intranet in a box that has group spaces to allow different teams to have their own conversations. It comes with six features – a blog, a wiki, a calendar, a to do list, a shoutbox, and a dashboard to manage it all.

But you’re not limited to just those features. Open Atrium is completely customizable. If you want a feature that’s not on that list, you can add it yourself. Read the documentation on community.openatrium.com, specifically the Build a Feature section, to find out how to do it.
Open Atrium

TeamLab

TeamLab is running on ASPX, its include project management, business collaboration, document management, calendar, CRM, email and more. The project management tool is perfect for medium sized projects.

All the TeamLab features are provided completely for free. There are no functionality, projects, user or time limits.

TeamLab is available in 3 deployment models: SaaS – you get ready-to-use software in the cloud, Open Source – you install TeamLab on your own server, AMI – you use a private Amazon machine with pre-installed TeamLab.
TeamLab

Adding Multiple Attachment for Joomla K2 Component according to the number of JoomFish’s language hack

Vincent — Thu, 24 Nov 2011 15:18:03 +0000

Auto detecting Joomfish languages with your K2 Component, making your attachment number of field to match with JoomFish Component site languages.
Please follow the below steps to achieve this.

Step 1

/administrator/components/com_k2/tables/k2attachment.php add this in around line 357

var $lang = null;

Step 2

/administrator/components/com_k2/model/item.php add this in around line 357, in “save” function

$attachments_language_code = JRequest::getVar('language_code', '', 'POST', 'array');

add this in around line 400, in “save” function

$attachments_language_code = JRequest::getVar('language_code', '', 'POST', 'array');

Step 3

/components/com_k2/models/item.php add this in around line 911, in “getItemAttachments” function

$lang = JRequest::getCmd( 'lang' );

Original

$query="SELECT * FROM #__k2_attachments WHERE itemID=".(int)$itemID;

Change it to

$query="SELECT * FROM #__k2_attachments WHERE itemID=".(int)$itemID . " and lang = '".$lang."'";

Step 4

/administrator/components/com_k2/views/item/tmpl/default.php change the javascript function “addAttachment”, replace the old one.

function addAttachment(){
   var div = new Element('div',{'style':'border-top: 1px dotted #ccc; margin: 4px; padding: 10px;'}).injectInside($('itemAttachments'));
   var str = "";
   str += "\" onclick=\"this.getParent().remove();\">";
   getKnownLanguages();
	foreach ($alllangs as $key=>$value) {
		list($langcode, $countryCode) = explode("-", $key);
   ?>
   var divlang = new Element('div').injectInside(div);
   var input = new Element('input',{'name':'attachment_file[]','type':'file'}).injectInside(divlang);
   var br = new Element('br').injectInside(divlang);
   var label = new Element('label').setHTML('').injectInside(divlang);
   var input = new Element('input',{'name':'attachment_title[]','type':'text', 'class':'linkTitle'}).injectInside(divlang);
   var br = new Element('br').injectInside(divlang);
   var label = new Element('label').setHTML('').injectInside(divlang);
   var textarea = new Element('textarea',{'name':'attachment_title_attribute[]','cols':'30', 'rows':'3'}).injectInside(divlang);
   var br = new Element('br').injectInside(divlang);
   var languagecode = new Element('input',{'name':'language_code[]','type':'hidden', 'value':''}).injectInside(divlang);
   str += "";
   str += "";
   str += "" +  divlang.innerHTML + "
";
   str += "";

 div.innerHTML = str;

   }

Step 5 – Database

enter this in your sql server (you will need phpmyadmin for this)

ALTER TABLE `jos_k2_attachments` ADD `lang` VARCHAR( 10 ) NULL

Step 6 – Need Help?

We do accept freelance customization to K2 and Joomfish development.
The freelance price for customization is USD50/hr*
*Minimum charge will be USD100
Interested Party please email us at info[a]designersandbox[dot]com

Social Engaging Email Entry Form – Enter to Win with Social Network Enable

Vincent — Thu, 24 Nov 2011 15:17:30 +0000

AppSumo recently had just launched an social engaging email entry form. The enter to win form is pretty simple, but what they have done is pretty smart. Each of the user can enter to the contest with 1 entry. The first entry ticket are trigger by your email address but there’s more.

After you have submitted your email address, then you will land on the social engaging form/app. There’s 5 other ways you can earn more entry, more entry from your email meaning more chance you are going to win from the contest. You can share of Facebook, tweet about it on Twitter, Follow the brand on there twitter account, Like them on Facebook, copy & paste a short paragraph along with link to your facebook wall. So each user will have 5 more chance of winning.

You can check out the entry form from here.
http://www.appsumo.com/spotify/ (Contest Ends December 16th, 11:59PM CST)
If the entry had ended, you can still check out from here, we did all the screen capture for you.

Some more of the form.

This is a very fun and in-directive way to engage your user.

Need Help or idea on your next project, do you need a coder for your next social engaging form?

We do accept freelance and consultation work on social engaging development.
The freelance and consultation price for social engaging development are USD50/hr*
*Minimum charge will be USD100, the form usually take 4 hours to build. This will depends on how much engagement you need from your targeted social network.
Interested Party please email us at info[a]designersandbox[dot]com

500+ CSS/HTML Grid Layouts (Grid System)

Vincent — Thu, 24 Nov 2011 05:53:44 +0000

“You need options. Anyone that’s spent time collaborating on web design projects knows that every developer has their own processes — even with best practices being observed there is variation in techniques. So your CSS library should give you more than one way to attack a problem.

Website layouts can be a serious pain, but CSS gives you a great deal of flexibility in how you approach the layout issue. Often the home page needs a grid design while post pages have a three column layout, with other formats for custom pages. With CSS layouts already in place, you can quickly implement a layout and change as needed.

The following is a collection of layout libraries you can add to your own with multi-column static and liquid layouts. Enjoy and let us know which ones you like best!”

by “Tara Hornor”

Customized Fluid/Variable CSS Grid Generator by Spry Soft

http://www.spry-soft.com/grids/
Static not good enough for ya?! No problem. Fluid/variable grids are easy to make with this site.

Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.

20+ CSS Layouts by MaxDesign

http://www.maxdesign.com.au/articles/css-layouts/
With excellent markup walk-thrus and the sample CSS on-page, this set of CSS layouts will be easy to see in action and almost as easy to implement.

40 CSS Layouts by Layout Gala

http://blog.html.it/layoutgala/
Previews are available for each format and you can even download the entire collection in one file.

250+ Layouts by Free CSS

http://www.free-css.com/
This is a massive list with just about every layout imaginable. Preview and click again to download. The CSS is stripped down so there’s lots of room for tweaking.

50+ Fixed Width Layouts by Code Sucks

http://www.code-sucks.com/css%20layouts/fixed-width-css-layouts/
Click to preview and click to download. These layouts are simple with nicely developed whitespace. Worth checking out and easy to modify.

10+ Unique CSS Layouts by Intensiv Station

http://www.intensivstation.ch/en/templates/
While on the sparse side in terms of the quantity, this collection includes some impressive tricks like floating menus and dynamic centered boxes worth having on hand.

40+ CSS Layouts by Dynamic Drive

http://www.dynamicdrive.com/style/layouts/
This site has organized their CSS layouts by two-column, three column, fixed, liquid, and frames. Each has a nice description and the ability to preview before downloading.

15+ Interesting CSS Layouts by The Noodle Incident

http://www.thenoodleincident.com/
This site has a unique way of guiding you thru the process of picking the layout you want. Follow the arrows, select your design, and download.

Customized Static CSS Grid Generator by Grid Designer

http://grid.mindplay.dk/
It doesn’t get much easier than this. Just set up the grid you want using the on-page tools and download your template.

Designer Sandbox

How to Create a Joomla! 2.5 QuickStart Package

Related Posts

When trying to save your menu item in Joomla! 2.5 – Save failed with the following error: JTableMenu: _getNode Failed

Related Posts

Centering a div block without the width using pure CSS (All Browser)

Easiest way to centering a div using pure CSS

html

css

Related Posts

20 Incredibly Free Web and Sans Serif Fonts

Aller

Sansation

Droid Sans

District Thin

Bebas Neue

Museo Sans

Calluna

ChunkFive

Ballpark

Museo Slab

CodeBold

CodeLight

Edelsans

Evolution

Giro

Kilogram

League Gothic

Miso

Nevis

QuickSand

Vegur

Related Posts

Tools and Tips for everyday web designing – Web Resolution and Size

Designing for the Web: Resolution and Size

Related Posts

POLYGONAL PORTRAITS by FEEL DESAIN

Related Posts

3 Professional Free Online Project Manger Tools

Freedcamp

Open Atrium

TeamLab

Related Posts

Adding Multiple Attachment for Joomla K2 Component according to the number of JoomFish’s language hack

Step 1

Step 2

Step 3

Step 4

Step 5 – Database

Step 6 – Need Help?

Related Posts

Social Engaging Email Entry Form – Enter to Win with Social Network Enable

Need Help or idea on your next project, do you need a coder for your next social engaging form?

Related Posts

500+ CSS/HTML Grid Layouts (Grid System)

Customized Fluid/​Variable CSS Grid Generator by Spry Soft

20+ CSS Layouts by MaxDesign

40 CSS Layouts by Layout Gala

250+ Layouts by Free CSS

50+ Fixed Width Layouts by Code Sucks

10+ Unique CSS Layouts by Intensiv Station

40+ CSS Layouts by Dynamic Drive

15+ Interesting CSS Layouts by The Noodle Incident

Customized Static CSS Grid Generator by Grid Designer

Related Posts

Customized Fluid/Variable CSS Grid Generator by Spry Soft