7 tips to build responsive theme in Drupal 7

June 12th, 2013

1)  Understand your design and decide on the breakpoints.

2)  Start with your theme info file

name = RoboSmart
description = A responsive mobile-first layout for a corporate site.
version = VERSION
core = 7.x
stylesheets[all][] = css/style.css<

3)  Create HTML5 pages for each unique page in your website.

Based on the grid system and the nature of your design, download grids from http://960.org. In the case of the RoboSmart theme we have used a single grid at 600 which is fluid and works for any screen resolution greater than 600px.

Start with the mobile design and move the way up for all the breakpoints. Convert the HTML5 pages to template files. This step is similar to that of any general drupal theme except that the same template is applicable for multiple breakpoints. If you are using HTML5 make sure you start with the declaration in your html.php.tpl file.

Validate the outline your page generates using an outliner. Structure the HTML5 tags and header tags to achieve the desired outline. Working your way up from the lowest to the highest breakpoint, i.e starting from the mobile design, is an important aspect of the mobile first approach.

4)  Segregate the styles for the different breakpoints using media queries. Detailed below options for using media queries.

Multifile option: Embed your media queries in the .info file

stylesheets[all][] = css/style.css
stylesheets[print][] = css/print.css
stylesheets[all and (min-width: 600px)][] = css/grid-600.css
stylesheets[all and (min-width: 600px)][] = css/style-600.css
stylesheets[all and (min-width: 480px)][] = css/style-480.css
stylesheets[all and (min-width: 960px)][] = css/style-960.css
stylesheets[all][] = css/fonts.css

Single file option: Write media queries inline in css files

media all and (min-width: 461px) and (max-width: 900px) {
//embed styles here
}

5) Embed viewport & other mobile/handheld device specific meta tags in the html.php.tpl file

<meta content=”width” name=”MobileOptimized”/>
<meta content=”true” name=”HandheldFriendly”/>
<meta content=”width=device-width” name=”viewport” />
<meta content=”on” http-equiv=”cleartype”/>

6) To enable IE support, add Html5shiv, Respond.js and Selectivizr.js files to your theme.

7) Test your theme in a default Drupal installation. Voila! Here we have a Drupal 7 theme that is responsive.

Post Refer by : http://www.unimitysolutions.com/blog/7-steps-building-responsive-theme-drupal-7

SEO Tips for Your Joomla Website

November 23rd, 2012

Joomla is a great platform to build your website upon. But your Joomla website can go all waste if it isn’t visible online or, in simple words, ranks high on the search engine results pages. To start with you need to understand that Joomla by itself won’t produce a search engine friendly website though there are many such claims floating online. Search engine optimization involves a lot of hard work and getting some basic things right. Here we shall discuss some simple tips which can go a long way in improving the online visibility of your Joomla website.

Use Search Engine Friendly URLs

This is the first step to optimizing your Joomla website. To do so you can make use of the SEF plugin that comes by default with Joomla. However, keep in mind that this plugin isn’t pre-activated and you need to visit the global configuration page to activate it. Apart from this you can also try third-party plugins such as sh404SEF. You should also enable ‘Use URL Rewriting’ under ‘Global configuration’.

Choose Right Servers

Choosing the right servers is vital to the performance of a website and here we recommend that you set up your Joomla website on an Apache server with mod_rewrite installed. This will allow you to make numerous modifications which are a part and parcel of search engine optimization process.

Get Meta Data Correct

This is one of the most tried and tested SEO techniques which still holds good. Make sure every page in your website has a relevant description and keywords related to the text. The description shouldn’t exceed more than 160 characters. This allows search engine crawlers to index your website easily for the targeted keywords. And most importantly avoid using unrelated keywords as they harm your brand value and attract penalty from the search engines.

Turn Off PDF Links

There are situations where the PDF pages rank higher than the main pages of the website. Now this might seem good but it hurts your cause as PDF files have no menu links and thus create a dead end scenario in the website. It would be wise to turn off all the PDF files and instead focus on the core areas of the website.

Rename htaccess.txt to .htaccess

Since you have enabled URL rewriting it is important that you rename the htaccess.txt file to .htaccess – which is the version used by Joomla and mod_rewrite. This helps in redirecting non-www address to www, doing away with duplicate pages in your website.

Optimize Image Size and Use Alt Tag

Images contribute substantially to the traffic in any website and this is one area we often tend to ignore when it comes to optimizing a Joomla website. Use low resolution images which are small in size as they make the website load faster. To add Alt Tag or alternate description make use of the JCE editor which allows you to describe your image. You can also define the image dimensions which improves the load speed of your website.

Turn On Cache

The smaller the site, the faster it loads and the more popular it’s with the users. And one of the best ways to make your website load fast is by turning on Cache. You can easily do this by visiting Global Configuration.

These are only a few basic techniques but the most important ones used to optimize a Joomla website. You may also try out other things which may seem feasible to your website’s needs.

PixelCrayons, a web development company, is the contributor of this post. The company specializes in ecommerce & CMS solutions. You may hire Joomla Developers and Magento Developers here at affordable rates.

8 Best Open Source Tools for Bug Tracking

November 5th, 2012

It is quite normal to have bugs in a software development process as this process includes coding of hundreds of lines. But the important part here is to track those bugs and fix them. Tracking bugs manually can blow the mind of a developer, so using a bug tracking tool can be a big time/fret saver for you.

Bug tracking tool is a software application that helps improve the quality of a software product or application by keeping a track of bugs in the software program. But choosing a correct bug tracking tool is not that simple because it all depends on the specific needs and personal preference.

So to make this task easy for you, here we have listed a few open source bug tracking tools for a better development process. Check them out:

1. Bugzilla

A web-based bug tracking tool that can help you handle software development process by allowing the bug tracking & fixing it efficiently. Bugzilla is used by many top-rated companies such as NASA, Linux, Facebook and Mozilla. Bugzilla is such a user-friendly tool that it allows any user to submit new bugs and to access information about any existing bug simply by setting up an account with Bugzilla.

2. MantisBT

    A free web-based bug tracking tool, MantisBT can        track  many projects for bugs at the same time and also enables multiple users to interact. MantisBT is a MySQL-based bug tracking tool written in PHP language. This tool  works on any web browser and can be installed on almost every operating system.

3. OTRS (Open Technology Real Services)

OTRS is a free Open-source Ticket Requesting System written in Perl. It is used to assign tickets to any incoming queries in an organization. OTRS supports many features such as multi-language support, email notifications etc.

4. The Bug Genie

It is a powerful web-based bug tracking tool written in PHP language. This tool is used to improve the development process by managing the bugs reports. Bug Genie supports multiple languages, platforms and database and has a user-friendly interface.

5. Fossil

A bug tracking tool based on SQL written in C language, Fossil, apart from bug tracking, provides Wiki. Features that make Fossil attention worthy are: easy-to-use web interface, supports auto-synchronization et al.

6. BugNET

BugNET is an open source bug tracking tool based on MySQL written in ASP.NET language. It is a cross-platform application used to keep the codebase simple. BugNET supports many features such as email notifications, multiple databases and projects supports, easy navigation, excellent security etc.

7. Collabtive

A cloud-based groupware, Collabtive is an easy and efficient open-source web-based bug tracking tool for your projects. Collabtive supports multiple projects with unlimited user profiles based on role-based permission management. Email notifications, time tracker and synchronization with calendars are also some noteworthy features that are supported by this tool.

8. Request Tracker

Based on MySQL written in Perl, Request Tracker (RT) provides issue tracking support that enables users to set priorities of the issues raise by making a ticket priority queue. What makes RT different from other bug tracking tools is its simplicity. RT is best suited for small projects.



Conclusion

Keeping track of bugs is an essential part of any software development project, but it doesn’t need to be difficult as numerous tools are available nowadays to do that task for you efficiently in minimal time. In the lifecycle of software development, bug tracking is one of the most important steps without which any software is incomplete – or rather inefficient.

This post is shared by PixelCrayons, a reputable web development agency specialized in WordPress and Joomla Development. You can get in touch with PixelCrayons if you are planning to hire experienced WordPress Developers or Joomla Developers.

PSD to HTML Email: A Great Way to Connect with Your Existing & Potential Clients

October 29th, 2012

HTML emails are indeed a popular way of marketing. In fact, emails have emerged as the most preferable method of sending messages to customers and clients.  When using HMTL emails for mail campaign there are certain important points you should bear in mind. Making an email to display properly in recipients inbox is not so easy, rather it requires complete understanding of the process. Take a look how you can develop HTML emails to render well across different clients, browsers and devices which people prefer to check their emails.

Work with the Images

Working with images for HTML email clients may take some efforts. For instance Gmail does not support background images and many email clients generally turn off images. To deal with this you can use background colors so that your emails are readable even when images are disabled. A common mistake clients make is that they link images to their hard drive and not on Webpage. So it is important to note that all links to images are complete and web based. Since most users do not allow display of images, use Alt attribute to add details of the image so that readers do get the required information.

If you are sending a promotional email or an invitation, do not include a single graphic because it may appear blank to the readers. Including graphics, text and your physical address, unsubscribing links etc will contribute to text to graphic ratio.

How to HTML/CSS an Email?

Using Microsoft Word, Publisher and FrontPage to generate HTML code for email may unintentionally result in unwanted extra coding. Even more the code so generated may make your email a spam or may break email design. Therefore coding for HTML email should preferably be done in good text editor and later import template.

As far as use of CSS for HTML email is concerned, this is a much talked topic.  Linked CSS or external CSS does not work properly with HTML email. Use of in-line CSS is recommended if you want to use CSS for your email. Use of CSS classes and CSS shortcuts should also be avoided rather set attributes to each part separately. This may depend on the type of your email but still you should try to use tables instead of float or position CSS options.

Do not forget to test your campaign email

Before you send your HTML email to the list of people, testing is important. This would include sending test emails to some popular email services options including Yahoo, Hotmail or Gmail. You can choose to set up AOL accounts or accounts with popular ISP’s of your area.

In case your email is created by a third person and you are just posting it do not expect it to work exceptionally well. You need to send some test campaigns to check if the content and graphics are displayed well. It is wise to test the images and links to ensure they work properly and follow absolute paths.

Things to avoid

Do not use JavaScript as doing so will mark your emails as spam.  This is because almost every email application blocks JavaScript as a security measure to prevent virus attack. So if you are copying HTML code from a source, make sure you remove all JavaScript.

Do not keep your HTML code too wide. See that the email is designed to fit suitably in the viewing area of clients. Do not include embedded movies, sound files, flash and ActiveX as they do not work properly in HTML email.

Conclusion

Generating HTML emails is an attractive method of Internet marketing. Learning the ways to develop HTML emails successfully and understanding what all things should be avoided may work wonders with your email marketing. Your HTML email needs a perfect balance of text and graphics so as to ensure it is perfectly readable and is not converted into spam rather. Owing to several email clients and limited CSS support in some email clients, proper design of HTML email is necessary. All this and much more – therefore we recommend you to choose a PSD to email expert for a flawless HTML email.

This post is shared by Markupbox, which is a specialized PSD to HTML Conversion Company, backed with years of experience and diligent professionals. MarkupBox offers PSD to HTML/CSS, PSD to HTML5 and software implementation services like PSD to Joomla, PSD to Magento,  PSD to WordPress, PSD to Drupal, PSD to Email and much more.

8 WordPress Plugins to Highlight Syntax within your Post

October 18th, 2012

If you have ever tried displaying code within a post then you must know about the various problems it can cause. But not to worry anymore, as we all know that some amazing developers are always their to make our day-to-day task as easy as possible. Developers have made hundreds (If not thousand) of plugins that can solve this problem.

Choosing the best from those hundreds of plugins is quite a tough job. So here we are with a list of 10 best WordPress plugins to highlight code within your blog. Honestly speaking, they all are good, it just depends on your needs that which suits you.

1. SyntaxHighlighter Evolved

SyntaxHighlighter Evolved is a real time syntax highlighter plugin enables users to highlight the code of the post with maintained format without any manual change.

2. Developer Formatter

Developer Formatter supports more then 110 programming languages such as PHP, ASP, Html, JavaScript, CSS, Java, C++, C, and Visual Basic and creates a better display of codes on your post.


3. Crayon Syntax Highlighter

Crayon Syntax Highlighter plugin displays the content of a file in a post. This plugin supports multiple languages and themes.


4. FV Code Highlighter

FV Code Highlighter plugin highlights your post code with Dreamweaver style. Plugin supports five programming languages named as PHP, (x)HTML, JavaScript, CSS and XML. Customization of plugin is quite easy with the basic knowledge of CSS.

5. WP-Syntax

WP-Syntax plugin makes it really easy to include code in your posts. This plugin can highlight sources of any language. WP-Syntax plugin supports highlighting with or without loosing it’s formating or any other change while copying snippets of code from the browser.

6. Preserve Code Formatting

Preserve Code formatting plugin preserve formatting of the code for display by preventing its modification by WordPress and other plugins while retaining original whitespace and characters.

7. CodeColorer

CodeColorer plugin is a syntax highlighter that supports color themes and many languages.

8. Sniplets

Sniplet plugin allows you to insert code snippets into the post. This pluign can be used automatically as well as manually.

This post is shared by PixelCrayons, a reputable web development agency specialized in WordPress and Joomla Development. You can get in touch with PixelCrayons if you are planning to hire WordPress Developers or Joomla Developers

.

Choose the Best Form Extensions for Your Joomla Website

October 8th, 2012

Joomla, one of the most widely used content management systems in the world, is amply powered by several extensions that help improve its functionality. To create forms in Joomla there are several extensions that can come handy. A visit to the Joomla Extensions Directory gives a fair idea of the number of form extensions currently available. In this article we will take a look at the best form extensions for powering your Joomla website.

1. RSform Pro : This form extension is by RSJoomla that has the capacity to meet every set of requirements for any kind of website. RSform Pro is easy to install and has some great features like the ability to store submissions to a database, Ajax validation for fields, mailchimp integration, drag and drop order change, salesforce integration, easy export to Excel with custom CSS and JavaScript in your form. It also has custom layout options and multi-page forms with PHP code execution.

2. Breezing Forms : When a clean interface welcomes a developer, non-programmer or designer, the first impression will definitely be impressive! This is what BreezingForms does at the first glance. It has three interfaces: QuickMode, Easy Mode and ClassicMode. All the three have simple steps that help you create forms easily. The drag and drop features really work great in all the three ways. However, the three interfaces are designed for three different type of users. For example, the QuickMode is for non-programmers who want to create simple forms easily, while the ClassicMode is for designers.

3. Mad4Joomla : Listed among the most popular Joomla form extensions in the Joomla Extensions directory, Mad4Joomla packs quite a punch with its features. It helps create email forms with better preferences for usability, classification in categories, working with templates, file uploads as attachments etc. Mad4Joomla, created by Mad4Media, is thus perfect if you are looking for a form extension for creating job forms, reservations, contacts, donations and polls among other things.

4. Chronoforms : The latest versions of Chronoforms form extension for Joomla have definite advantages over its previous versions, especially with the form field drag and drop function. Starting from options for basic form features like field creation to email processing, data validation, data storage and management, Chronoforms does boast of several improvements. Security of the form extension is built in Captcha + ReCaptcha support. You can also perform several Joomla functions on this extension such as Joomla registration forms, User Login and Article submission. The disadvantage of using Chronoforms is that you need to create separate tables for submissions unlike the other form builders. However, it is one of the best form extensions available currently.

5. Proforms : If you are looking for a form extension that gives extensive professional functions, Proforms is the one for you. The latest Proforms version is built for Joomla 1.3 and 3.0 and works equally great for beginners as well as designers and experts. It is very easy to use the form components and is built in App System. The database support for Proforms allows excellent records manager and also export of db records in CSV and Excel format. The security is well defined with 5 Captchas including reCaptcha, Spamtraps and sending time review options. Proforms also allows custom HTML between form fields.

A visit to the Joomla extension directory will give you a glimpse of the other form extensions available for creating forms. The five listed above are among the most popular ones used.

PixelCrayons, a web development company, is the contributor of this post. The company specializes in ecommerce & CMS solutions. You may hire Joomla Developers and Magento Developers here at affordable rates.

How to stop Access of Hackers on your WordPress Blog?

June 28th, 2012

Prevention is better than cure and this applies not only for our health but also for ensuring the security of our business. Since websites have become an integral part of business today, it is essential that they are kept safe and secured. Many businesses prefer using WordPress blog to start up their online venture. WordPress is known for offering a user-friendly, robust blogging platform for businesses. Though most WordPress blogs are not hacked, it is still important that you keep your blog safe. Hackers are outside threats that can seriously harm sensitive data of your business. It is essential that hackers are kept at bay and the WordPress blog made string enough to fight unwanted intrusion.

Read the rest of this entry »

5 Steps You Should Regularly Carry Out on Your WordPress Blog

June 26th, 2012

Very few will not agree that WordPress is the best blogging platform currently available on the web. With its multitude of features, you will be spoilt for choice regarding how to optimally use the content management system. One thing that makes WordPress quite infamous is its slow loading time and the tendency to create problem when it has too much data. But if there is a problem, there has to be a solution. For WordPress blogging, the solution is right in front of your eyes. It isn’t difficult or cumbersome if you make it a point to keep servicing the platform regularly. Many bloggers will tell you to compare WordPress blogging with an automobile and remind you to service the blogging platform like you regularly service your car. The comparison is pretty apt considering the fact that servicing increases the longevity of your site.

5 Steps on How to Maintain Your WordPress Blog

  1. Regular Backups: There is so much that can happen to your blog if you do not keep regular backups. You will find many bloggers sharing their woes of how they lost a month’s data due to a malware or an external threat to the site all because they didn’t create backups of the blog. Make it a habit to regularly create backups as this is a must. WordPress experts suggest creating a backup at least once a week. You will find appropriate plugins for this purpose too.
  2. Update WordPress Versions: The WordPress community keeps on releasing new versions of the blogging platform now and then. It is advisable to make it a point to regularly upgrade into such new versions. You may be thinking that every new version will not have much different to offer that is actually true. But by upgrading you will ensure that the security improves. With an old version, the risk to threats increases that is something you wouldn’t want.
  3. Update Plugins and Delete Unwanted Ones: It doesn’t matter how many or which plugin you use. The fact remains that they need to be updated regularly so that they function well. When you start using WordPress, numerous plugins must have impressed you and you may have installed several plugins. But as time goes by, you realize that you don’t really need all of them. If you ever feel that a plugin is unnecessary, immediately delete that plugin. Please note that you have to ‘delete’ it and not ‘deactivate’ it.
  4. Delete Spam: Make it a habit to check the spam folder and delete all spam. Do this at least once a week to control unwanted utilization of space. You could also install plugins to help delete spam, such as Akismet and Growmap Anti Spambot Plugin.
  5.  Update Themes: If you have bought a premium theme for your blog, make it a point to update it regularly. Always be in touch with the theme developer and see that you update the theme as soon as the developer makes some change in the theme. This will once again ensure that your WordPress blog is free of external threats.

Joomla Vs WordPress: Which is The Most Powerful CMS?

June 22nd, 2012

Content management systems have changed the way how websites are built and managed. Businesses have benefitted using CMSs as it allowed non-technical people to contribute content to a website without having any coding skills. Joomla and WordPress have been the two most popular content management systems in the world and there has always been a raging debate on which is the best. Both these CMS solutions are being used around the globe by hundreds of thousands of websites and have their own pros and cons when brought to a comparing table. Let us now take a look at the strengths and weaknesses of each of these content management systems.

WordPress

This is by far the most popular content management systems in the world having the largest market share among all CMS solutions in the world. Built in PHP it was primarily built as a blogging platform which also allows developers to build complete websites.

Strengths

  • It installs in no time and comes with a built editor within the admin area which allows developers to make all the customary changes to the website as is required
  • There are nearly 1500+ free and premium themes and over 20000 plugins available in WordPress making it the most diverse content management system in the world. From a corporate website to a photo blog or e-zine all kinds of websites can be developed using WordPress.

Weaknesses

  • Though WordPress can be used to build all kinds of websites it is primarily used only as a blogging platform. Building complex websites in WordPress is a painstaking task.
  • Security in WordPress isn’t as strong as in Joomla and the websites fall easy prey to hackers and viruses especially when using free themes.
  • The navigation structure of a WordPress website cannot easily be altered as in Joomla as the navigation is determined by the theme you choose and to change this you would need to alter the CSS.

Joomla

Right at the outset it was designed as a complete website management solution. It is built in PHP and used MySQL as its database. Once deployed this content management system can easily be extended with a wide array of extensions.

Strengths

  • Joomla allows multiple users to edit the website at the same time making it ideal for businesses which offer many users to permission to edit the website.
  • It can be used to a community or a network with a membership area, newsroom, forums, articles etc. as it manages all these complex tasks with ease.
  • This content management system supports multi-lingual websites which allows businesses to have their website in multiple languages.

Weaknesses

  • The learning curve is steep in Joomla compared to WordPress and the developer and user need to get acclimated to the admin and other features of the Joomla website.
  • Joomla codes aren’t as search engine friendly as that of WordPress and you need to optimize a website to attract targeted traffic from the search engines.
  • Joomla uses excess JavaScript and CSS to display pages which makes the website heavy and load slow on the web browser.

It is difficult to pass a judgment over which is the best CMS solution between WordPress and Joomla and purely depends upon the need of the business. If you are planning to develop a simple website with limited features and functionalities WordPress would be the perfect choice for you. In case of complex websites with large databases one should opt for Joomla.

Facebook WordPress Tool to Make Your Blogging More Social

June 15th, 2012

Social media marketing has become one of the most important things for any website or blog. On the same note, businesses that use WordPress as a blogging platform are increasingly making use of this social media to promote their blogs. They do so to get recognition among the present customers and reach out to potentially new ones. Facebook has become one of the largest social networking platform in the world with 800+ million users; this is the first choice for WordPress developers. The ideal way to promote your blog on Facebook is to use third-party plugins. These plugins or tools can easily be integrated in your WordPress blog and allow you to share your posts and promote them virally.

Popular Facebook Tools for WordPress

  • Facebook for WordPress – This is one of the most popular Facebook plugins as it allows you to cross-publish content on the social networking site. The published posts appear on the Facebook Timeline as well as on the Facebook Pages helping you reach out to your followers virally.
  • Facebook Fan Box Plugin – Facebook Fan Box plugin helps in gathering fans on Facebook, which is one of the most sought after things for any business. It displays a box on your blog showing recent updates made on your Facebook page along with details of the fans that have followed you, thus encouraging your visitors to join the club.
  • WordPress Facebook Connect – Another popular WordPress plugin this adds Facebook functionality to your blog. Your visitors can post their comment on your blog with their Facebook account. The comments would appear on their news feed and profile pages and will be visible within their network. It encourages others to read your blog and creates a community surrounding your blog.
  • Facebook Posted Items – With the use of this WordPress plugin, you will be able to display a list of items that you have posted on Facebook. This is a good way of promoting online content that attracts the visitors and would be beneficial for you as well. This way you can add some variety to your Facebook page which in turn drives in more visitors to your official blog.
  • Facebook Live Stream – If you are webcasting a live event on your WordPress blog and want to promote it over a huge network, this is the perfect plugin for you. It allows your fans to share comments and activity on their Facebook profiles instantly. This real-time marketing allows you to promote events which can lead to fast sales.

These plugins allow you to market your WordPress blog virally and create a brand identity for your business over such a powerful platform helping you gather new leads and penetrate into newer markets. This marketing campaign needs to be handled methodically identifying your target audience. You should strike a perfect balance with the campaign as too much of promotion can annoy your fans and followers. It is advisable that you hire the services of a good Internet marketing company, which has expertise in social media marketing.