Get Google Analytics Tracking Code

Google Analytics is a freemium software service that helps websites monitor traffic and identify trends in site visitor behavior that could, ultimately, impact marketing, conversions, revenue, and profits.

WordPress is the single most popular content management system with between 48 percent and 62 percent of the CMS market, according to BuiltWith, Opensource CMS, and W3Techs. Others estimate that WordPress powers at least one-in-five of the top 10 million sites on the web.

Ecommerce is also embracing WordPress as an estimated 250,000 sites use WooCommerce, the popular WordPress plugin that transforms the WordPress CMS into a functional ecommerce platform. WP eCommerce, another WordPress plugin, has been downloaded more than 2 million times since its release in 2006, and may have tens or even of hundreds of thousands of live ecommerce sites running on it.

Given the utility and popularity of Google Analytics and WordPress, it makes sense to demonstrate how quickly and easily the two solutions could be used together. What follows are the easy steps to install Google Analytics on any site using WordPress 3.9.1 or similar.

Get Google Analytics Tracking Code

Google has been known to change the Analytics navigation and terminology relatively frequently, and the company doesn’t necessarily follow a versioning system. So it is possible that some users could have a slightly different interface than what is described here.

In general, open up Google Analytics. You will need to create an account, if you have not already done so. Once you have an account, navigate to the Admin page.

Navigate to the Admin page in Google Analytics.

With the Admin page open look for the “Tracking Info” link in the “Property” column. Under “Tracking Info” click “Tracking Code.”

The Tracking Code link is in the Tracking Info section of the navigation.

Clicking the “Tracking Code” link should open a new section and slide the Property column to the left. This new section includes a snippet JavaScript tracking code. Copy the code, and get ready to paste it into place on your WordPress site.

The Tracking Code should be copied and later pasted into place.

Add the Tracking Code to WordPress

Open your WordPress installation’s site administration. These instructions are for the form of WordPress (version 3.9.1) that you install on a server rather than the form of WordPress hosted at WordPress.com.

From the administration panel select “Appearance” and then “Editor” to open up the theme editor. This editor should allow you to make changes to your WordPress theme files. If for some reason, you have trouble saving changes, check your server to ensure that the theme files may be overwritten.

The WordPress Appearance Editor allows users to modify the current theme.

Google Analytics tracking code may be placed in either the WordPress header file (header.php) or footer file (footer.php). If you place the tracking code in the WordPress header, the Google Analytics script will be run as the page begins to load and should complete whether the rest of the page loads or not. In this way, you will be prioritizing Google Analytics, ensuring that each visit will be counted. Placing the tracking code in the WordPress footer means that almost the entire page will load before the Google Analytics tracking script is run, but many developers like to place JavaScript, in general, at the end of a page in the hope that the page will load a millisecond faster.

With the WordPress editor page open, find the header.php (for our example, the tracking code is going in the header) under the Templates column and select it so that it is the active file.

Locate the header.php file from the Templates column.

In the editor, locate the closing head tag, which has a forward slash (/) before the word “head” inside of HTML’s characteristic brackets.

Locate the closing head tag in the code.

Add a couple of new lines and paste the Google Analytics tracking code into the header.php file just about the closing head tag.

Paste the Google Analytics tracking code in place and save the changes.

Save the changes and update the file. Google Analytics should be installed. Try clicking around on the site a bit and checking out the Real Time analytics from the Google Analytics interface to ensure that everything is working correctly.

Beyond the Basics

This rather basic installation of Google Analytics will provide some information, but many, if not most businesses, will want to use more advanced features like custom variables or ecommerce tracking.

All of these features can be set up manually. As an example, check out Tim Wilson’s article “Google Analytics: 5 Custom Ecommerce Events to Track,” which explains what online merchants should track with Google Analytics and the code necessary to add some of these custom variables.

Also see Wilson’s articles “Configuring Google Analytics, Part 1: Are You Taking Full Advantage?” and “Configuring Google Analytics, Part 2: Advanced Capabilities” to get the most out of Google Analytics.

There are also a couple of popular WordPress plugins that can help with Google Analytics.

The first is “Google Analytics for WordPress” from developers Joost de Valk and Barry Kooij. This plugin provides an interface for WordPress users to set up a few custom variables like tracking a post author from a plugin options page. For sites that are using content marketing to promote transactions, this plugin can be very helpful. Also, if you install this plugin, you do not need to add Google Analytics tracking code, but rather have verify your Google Analytics account with the plugin and allow it to add the appropriate tracking code for you.

Businesses using WooCommerce may also want to consider using the “WooCommerce Google Analytics Integration” WordPress plugin, which can help track sales all the way back to the last click referrer.

Read More

Google adsense

As you may know, AdSense ads generate revenue for the blog owner. Also, aside from Facebook, Twitter and Google+ one of the most constant sources of information and communication networks on the net are the Blogs. Having a popular blog increases your chances of generating income with AdSense ads.

Steps

1. 
   1
   Log in to your Blogger dashboard. You will see your blog list(All the blog you have created)
   Ad
2. 
   2
   Choose with a click a blog where you want to add AdSense Ads
3. 
   3
   There is a left side bar, one of the options is "Earnings" click it
4. 
   4
   Click on the option "Sign Up for Google" - Follow the steps they show.
5. 
   5
   After your account is approved, go back to your blogger dashboard and click the option "Layout" that is after "Earnings"
6. 
   6
   According to your layout you will see the options "Add a Gadget" - Click it
7. 
   7
   A window will popup, scroll down till you find "AdSense", click it
8. 
   8
   In the last step all you need to do is configure your Adsense Ads: Chose the color, size and then Save it. You are all done.
9. 
   9
   Refresh your blog to see your AdSense Ads

Read More

Using Default Static and Blog Page Settings in WordPress

WordPress comes with built-in support for creating a custom home page (static front page), and a separate page for blog posts. To use this method, you need to create two new WordPress pages. The first page is going to be your custom home page. In your WordPress admin, go to Pages » Add New to create a new page. You can title this page Home. On the right hand side, you will see Page Attributes box with an option to choose a template.

Most modern WordPress themes come with custom page templates that can be used for the static front page of your website. In this example we are using the Twenty Twelve theme which comes with a front page template. After choosing the template, the next thing you need to do is to click on screen options at the top right corner of the screen and check the discussion box.

This will display discussion meta box below the post edit area. Uncheck both comments and trackbacks to disable discussion on the home page.

Next you need to create another page for your blog posts. You can title this page as Blog. A lot of WordPress themes come with different templates, and it is possible that your theme may have a template to be used for blog page. However, if there is no template available in your theme, then you can simply choose default. Don’t forget to disable the comments and trackbacks option on this page as well.

What we have done here is created two pages which we will use to display a custom homepage and a page for blog posts. Now we need to get WordPress to use these pages accordingly. To do that go to Setttings » Reading and under the Front page displays option choose A static page. Below that choose the page to be used as the front page and the page for your blog posts.

Read More

How To add post label

What are labels and how to use labels in Blogger to sort your content?

Posted in Blogging By Sureyea

Are you using your Blogger labels in a right way to sort your content or you just spamming it? We see most new bloggers think labels as a Meta keywords and just spamming it. So in this post we will see what labels in blogger are and how to use labels the right way. It might differ in other blogging platforms. So in wordpress instead of labels we havecategories and tags and we made a detailed article for wordpress users in order to better understand categories and tags in wordpress.

Now it’s time to explain about labels in Blogger. Categories, tags and labels all the three are same and their main purpose is to sort your content. Labels are mainly for your site visitors for better navigational purpose and not for search engines. By sorting right content using right labels your visitors can easily pick the right topic that they are interested in.

What are labels in Blogger?

Labels are known as blog categories. For example services, about us, contact us are pages that you add it in your menu tabs. So that users can know about your blog what service you offer this and that etc. Labels are linked pages that show several related blog posts.

For example let’s say you running a cookery blog and you are posting about “how to make a pizza” and you are sorting it with three labels such as cooking, oven and pizza. Now you are posting another topic about “how to make French fries” and you are sorting it with fry pan, French fries and cooking. So if your visitors want to learn more about cooking they will use the label cooking which contains two posts.

Labels help users to pick related posts that they are interested in just as like related posts widget that you show below your blog posts.

How many labels in blogger are too much?

This question actually depends upon your blog topics. In wordpress we have two options, where we use categories as main topics and tags as micro topics. In Blogger you have only one option that is labels. You can have as many labels you want for your site, but sort your content with not more than three labels and not more than three words per label. Never have a label with no posts in it.

For better navigation and user experience you can show your labels in both menu tabs and in sidebar. Show your main blog labels in your menu tab that is the label that has most filled article. Show labels in sidebars that has fewer topics in it.

Labels in search engine optimization

As it’s already mentioned above labels are only for humans and not for search engines. So use labels wisely to sort your content and never spam your keywords. When your posts increases your blog labels will also get increased so better is to have rel=noindex and nofollow tags. By default you labels are blocked in your robots.txt so you don’t need to worry about this.

How to use labels in Blogger menu tab and sidebar

Adding labels in your menu tab and sidebar is easy and here is a tutorial about adding labels in Blogger menu tab.

To add labels in Blogger sidebar login to your Blogger dashboard >> layout and select add a gadget from sidebar. Now open labels in the popup window and configure it as you like. Once done save the layout arrangement.

Blogger labels – key points

Keep in mind that labels are only to enhance your user experience so…

1. Use labels wisely to sort your content
2. Do not use more than three labels per post
3. Do not use more than three words per labels
4. Never have or add labels with no post in it.

Hope this article helped you with better understand labels and how to use labels in Blogger. Share, comment and subscribe for blog updates.

Read More

Html 5

We hand-pick some great HTML examples, and talk to the designers behind them to find out how they went about it.

We bring you some of the best HTML examples around and ask the designers who made them just how they achieved their goals. HTML5 is the latest version of HTML - the markup language used to display web pages.

Although it's technically still in development, it's very much ready to use today, to build websites and web apps. And here are some great examples of HTML5 in action, to see exactly what you can achieve with it.

Read More

Add Dropdown Menus to Blogger

This post has supporting code that goes along with the tutorial on Adding Menus to Blogger. This course includes detailed instructions and a video that will walk you though exactly what to do with the code below. Watch the video to learn what to do with this code >>

Step ONE:  Plan for your menu bar, creating a sitemap with all the links that you want to use.

Step TWO: Grab this code … replacing it with all your links … then add it into a new HTML widget where you want your menu bar to appear:

<!-- start navmenu --> <ul id='cssnav'> <li class="active"><a href='http://LINK.com'>Home</a></li> <li class="sub"><a href='http://CATEGORY-ONE-LINK.com'>Category 1</a> <ul> <li><a href='http://SUB-CATEGORY-ONE-LINK.com'>SUB-category1</a></li> <li><a href='http://SUB-CATEGORY-TWO-LINK.com'>SUB-category2</a></li> <li><a href='http://SUB-CATEGORY-THREE-LINK.com'>SUB-category3</a></li> </ul> </li> <li><a href='http://CATEGORY-TWO-LINK.com'>Category 2</a> <ul> <li><a href='http://SUB-CATEGORY-ONE-LINK.com'>SUB-category1</a></li> <li><a href='http://SUB-CATEGORY-TWO-LINK.com'>SUB-category2</a></li> <li><a href='http://SUB-CATEGORY-THREE-LINK.com'>SUB-category3</a></li> </ul> </li> <li><a href='http://CATEGORY-THREE-LINK.com'>Category 3</a> <ul> <li><a href='http://SUB-CATEGORY-ONE-LINK.com'>SUB-category1</a></li> <li><a href='http://SUB-CATEGORY-TWO-LINK.com'>SUB-category2</a></li> <li><a href='http://SUB-CATEGORY-THREE-LINK.com'>SUB-category3</a></li> </ul> </li> <li><a href='http://CATEGORY-FOUR-LINK.com'>Category 4</a> <ul> <li><a href='http://SUB-CATEGORY-ONE-LINK.com'>SUB-category1</a></li> <li><a href='http://SUB-CATEGORY-TWO-LINK.com'>SUB-category2</a></li> <li><a href='http://SUB-CATEGORY-THREE-LINK.com'>SUB-category3</a></li> </ul> </li> </ul> <!-- end navmenu -->

NOTE 1:  There is no styling added yet … so this will not look like much just yet.  But stay with me 
NOTE 2: You are welcome to add more categories and sub-categories as you need. Just copy the same format as listed in the example.

Step THREE: Go into the Blogger Template Designer (click on CUSTOMIZE … then on ADVANCED … then on ADD CSS) and add the following:

/* ----- CSS Nav Menu Styling ----- */ #cssnav { margin: 0px 0 0 -30px; padding: 0px 0px 0px 0px; width: 1050px; /* Set your width to fit your blog */ font: $(tabs.font); /* Template Designer - Change Font Type, Size, Etc */ color: $(tabs.text.color); /* Template Designer - Change Font Size */ } #cssnav ul { background: $(tabs.background.color) $(tabs.background.gradient) repeat-x scroll 0 -800px; _background-image: none; /* Template Designer - Change Menu Background */ height: 20px; /* Change Height of Menu */ list-style: none; margin: 0px; padding: 0px; } #cssnav li { float: left; padding: 0px; } #cssnav li a { background: $(tabs.background.color) $(tabs.background.gradient) repeat-x scroll 0 -800px; _background-image: none; /* Template Designer - Change Menu Background */ display: block; margin: 0px; font: $(tabs.font); /* Template Designer - Change Font Type, Size, Etc */ text-decoration: none; } #cssnav > ul > li > a { color: $(tabs.text.color); /* Template Designer - Change Font Color */ } #cssnav ul ul a { color: $(tabs.text.color); /* Template Designer - Change Color */ } #cssnav li > a:hover, #cssnav ul li:hover { color: $(tabs.selected.text.color); /* Template Designer - Change Font Color on Hover */ background-color: $(tabs.selected.background.color); /* Template Designer - Change Font Background on Hover */ text-decoration: none; } #cssnav li ul { background: $(tabs.background.color) $(tabs.background.gradient) repeat-x scroll 0 -800px; _background-image: none; /* Template Designer - Change Menu Background */ display: none; height: auto; padding: 0px; margin: 0px; position: absolute; width: 200px; /* Change Width Of DropDown Menu */ z-index:9999; } #cssnav li:hover ul { display: block; } #cssnav li li { background: $(tabs.background.color) $(tabs.background.gradient) repeat-x scroll 0 -800px; _background-image: none; /* Template Designer - Change Background */ display: block; float: none; margin: 0px; padding: 0px; width: 200px; /* Change Width Of DropDown Menu */ } #cssnav li:hover li a { background: $(tabs.selected.background.color); /* Template Designer - Change Background of Link on Hover */ } #cssnav li ul a { display: block; height: auto; margin: 0px; padding: 10px; text-align: left; } #cssnav li ul a:hover, #cssnav li ul li:hover > a { color: $(tabs.selected.text.color); /* Template Designer - Change Text Color on Hover */ background-color: $(tabs.selected.background.color); /* Template Designer - Change Background on Hover */ border: 0px; text-decoration: none; }

NOTE: I’ve listed notes next to a few lines of this code to point out what you can change and style for your own blog.

Read More

Ict Notes

Introduction
In the Australian Curriculum, students develop ICT capability as they learn to use ICT effectively and appropriately to access, create and communicate information and ideas, solve problems and work collaboratively in all learning areas at school, and in their lives beyond school. The capability involves students in learning to make the most of the digital technologies available to them, adapting to new ways of doing things as technologies evolve and limiting the risks to themselves and others in a digital environment.
The Melbourne Declaration on the Educational Goals for Young Australians (MCEETYA 2008) recognises that in a digital age, and with rapid and continuing changes in the ways that people share, use, develop and communicate with ICT, young people need to be highly skilled in its use. To participate in a knowledge-based economy and to be empowered within a technologically sophisticated society now and into the future, students need the knowledge, skills and confidence to make ICT work for them at school, at home, at work and in their communities.
Information and communication technologies are fast and automated, interactive and multimodal, and they support the rapid communication and representation of knowledge to many audiences and its adaptation in different contexts. They transform the ways that students think and learn and give them greater control over how, where and when they learn.
Scope of ICT capability
The nature and scope of ICT capability is not fixed, but is responsive to ongoing technological developments. This is evident in the emergence of advanced internet technology over the past few years and the resulting changes in the ways that students construct knowledge and interact with others.
Students develop capability in using ICT for tasks associated with information access and management, information creation and presentation, problem solving, decision making, communication, creative expression, and empirical reasoning. This includes conducting research, creating multimedia information products, analysing data, designing solutions to problems, controlling processes and devices, and supporting computation while working independently and in collaboration with others.
Students develop knowledge, skills and dispositions around ICT and its use, and the ability to transfer these across environments and applications. They learn to use ICT with confidence, care and consideration, understanding its possibilities, limitations and impact on individuals, groups and communities.
For a description of the organising elements for ICT capability, go to Organising elements.
ICT capability across the curriculum
ICT capability supports and enhances student learning across all areas of the curriculum. Students develop and apply ICT knowledge, skills and appropriate social and ethical
2
protocols and practices to investigate, create and communicate, as well as developing their ability to manage and operate ICT to meet their learning needs.
Learning areas provide the content and contexts within which students develop and apply the knowledge, skills, behaviours and dispositions that comprise ICT capability.
ICT capability and the Technologies learning area
Information and communication technology is represented in two ways in the Australian Curriculum: through the ICT capability that applies across all learning areas and within the Technologies curriculum through Digital technologies. The ICT capability will be reviewed (and revised if necessary) to ensure that there is consistency with the Technologies curriculum following its development.
The ICT capability is addressed through the learning areas and is identified wherever it is developed or applied in content descriptions. It is also identified where it offers opportunities to add depth and richness to student learning in content elaborations. An icon indicates where ICT capability has been identified in learning area content descriptions and elaborations. A filter function on the Australian Curriculum website assists users to find where ICT capability has been identified in F–10 curriculum content. Teachers may find further opportunities to incorporate explicit teaching of ICT capability depending on their choice of activities. Students can also be encouraged to develop capability through personally relevant initiatives of their own design.
• Information and communication technology in English (http://www.australiancurriculum.edu.au/English/General-capabilities)
• Information and communication technology in Mathematics (www.australiancurriculum.edu.au/Mathematics/General-capabilities)
• Information and communication technology in Science (www.australiancurriculum.edu.au/Science/General-capabilities)
• Information and communication technology in History (www.australiancurriculum.edu.au/History/General-capabilities)
Background
This background summarises the evidence base from which the ICT capability’s introduction, organising elements and learning continuum have been developed. It draws on recent international and national research, as well as initiatives and programs that focus on ICT across the curriculum.
ICT capability is based on sets of relevant knowledge, skills, behaviours and dispositions. Internationally, such capability is typically represented developmentally across interrelated domains or elements to show increasingly sophisticated experiences with the technology. For example, the ICT curriculum for England presents ‘lines of progression’ in strands and sub-strands. The National Education Technology Standards (NETS) for students provided by the International Society for Technology in Education (ISTE) represent capability with six sets of standards. In Australia, the Statements of Learning for ICT were presented as five broadly defined conceptual organisers, representing key aspects of ICT that apply across
3
the curriculum. The Australian Council for Educational Research (ACER) has also identified a progression in research associated with the National Assessment Program – ICT Literacy.
Early researchers into ICT in education, such as Papert (1980) and Turkle (1984), considered that students constructed reality from experience and prior knowledge. The student interacts with the environment and, to cope with this environment, develops a conceptual framework to explain the interaction.
More recent theorists, such as Dede (2009), echo these earlier propositions even as technologies evolve, giving rise to the set of constructs upon which the ICT capability is based. In particular, the overarching element Applying social and ethical protocols and practices when using ICT addresses the personal, social and cultural contexts introduced by theorists such as Papert and Turkle.
ICT capability is based on the assumption that technologies are digital tools that enable the student to solve problems and carry out tasks. That is, the ICT system needs to suit the student and the task, while the student needs to develop an understanding of what the machine can do and an appreciation of the limitations under which it operates. In this way, students come to perceive ICT systems as useful tools rather than feeling that they themselves are the tools of the machine (Maas 1983). The latter often occurs when users have little information about how ICT systems operate and simply follow set, standard procedures, determined for them by the system.
Therefore, the ICT capability needs to take account of the types of tasks that provide authentic contexts for learning. The range of tasks is categorised into three sets: Investigating with ICT, Communicating with ICT and Creating with ICT. Students also need the knowledge and skills to use ICT based on an understanding of the ‘nature of the machine’. This is encompassed in the Managing and operating ICT element of the continuum.

Read More

ICT Intro

Globalization and technological change—processes that have accelerated in tandem over the past fifteen years—have created a new global economy “powered by technology, fueled by information and driven by knowledge.” ^[1] The emergence of this new global economy has serious implications for the nature and purpose of educational institutions. As the half-life of information continues to shrink and access to information continues to grow exponentially, schools cannot remain mere venues for the transmission of a prescribed set of information from teacher to student over a fixed period of time. Rather, schools must promote “learning to learn,” : i.e., the acquisition of knowledge and skills that make possible continuous learning over the lifetime. ^[2] “The illiterate of the 21st century,” according to futurist Alvin Toffler,“will not be those who cannot read and write, but those who cannot learn, unlearn, and relearn.”

Concerns over educational relevance and quality coexist with the imperative of expanding educational opportunities to those made most vulnerable by globalization—developing countries in general; low-income groups, girls and women, and low-skilled workers in particular. Global changes also put pressure on all groups to constantly acquire and apply new skills. The International Labour Organization defines the requirements for education and training in the new global economy simply as “Basic Education for All”,“CoreWork Skills for All”and “Lifelong Learning for All”. ^[3]

Information and communication technologies (ICTs)—which include radio and television, as well as newer digital technologies such as computers and the Internet—have been touted as potentially powerful enabling tools for educational change and reform. When used appropriately, different ICTs are said to help expand access to education, strengthen the relevance of education to the increasingly digital workplace, and raise educational quality by, among others, helping make teaching and learning into an engaging, active process connected to real life.

However, the experience of introducing different ICTs in the classroom and other educational settings all over the world over the past several decades suggests that the full realization of the potential educational benefits of ICTs is not automatic. The effective integration of ICTs into the educational system is a complex, multifaceted process that involves not just technology—indeed, given enough initial capital, getting the technology is the easiest part!—but also curriculum and pedagogy, institutional readiness, teacher competencies, and long-term financing, among others.

This primer is intended to help policymakers in developing countries define a framework for the appropriate and effective use of ICTs in their educational systems by first providing a brief overview of the potential benefits of ICT use in education and the ways by which different ICTs have been used in education thus far. Second, it addresses the four broad issues in the use of ICTs in education—effectiveness, cost, equity, and sustainability. The primer concludes with a discussion of five key challenges that policymakers in developing countries must reckon with when making decisions about the integration of ICTs in education, namely, educational policy and planning, infrastructure, capacity building, language and content, and financing.

Read More

CSS Background

Background Color

The background-color property specifies the background color of an element.

The background color of a page is defined in the body selector:

Example

body {
    background-color: #b0c4de;
}

Try it yourself »

With CSS, a color is most often specified by:

• a HEX value - like "#ff0000"
• an RGB value - like "rgb(255,0,0)"
• a color name - like "red"

Look at CSS Color Values for a complete list of possible color values.

In the example below, the h1, p, and div elements have different background colors:

Example

h1 {
    background-color: #6495ed;
}

p {
    background-color: #e0ffff;
}

div {
    background-color: #b0c4de;
}

Try it yourself »

---

Background Image

The background-image property specifies an image to use as the background of an element.

By default, the image is repeated so it covers the entire element.

The background image for a page can be set like this:

Example

body {
    background-image: url("paper.gif");
}

Try it yourself »

Below is an example of a bad combination of text and background image. The text is almost not readable:

Example

body {
    background-image: url("bgdesert.jpg");
}

Try it yourself »

---

Background Image - Repeat Horizontally or Vertically

By default, the background-image property repeats an image both horizontally and vertically.

Some images should be repeated only horizontally or vertically, or they will look strange, like this:

Example

body {
    background-image: url("gradient_bg.png");
}

Try it yourself »

If the image is repeated only horizontally (repeat-x), the background will look better:

Example

body {
    background-image: url("gradient_bg.png");
    background-repeat: repeat-x;
}

Try it yourself »

---

Background Image - Set position and no-repeat

	Note: When using a background image, use an image that does not disturb the text.

Showing the image only once is specified by the background-repeat property:

Example

body {
    background-image: url("img_tree.png");
    background-repeat: no-repeat;
}

Try it yourself »

In the example above, the background image is shown in the same place as the text. We want to change the position of the image, so that it does not disturb the text too much.

The position of the image is specified by the background-position property:

Example

body {
    background-image: url("img_tree.png");
    background-repeat: no-repeat;
    background-position: right top;
}

Try it yourself »

---

Background - Shorthand property

As you can see from the examples above, there are many properties to consider when dealing with backgrounds.

To shorten the code, it is also possible to specify all the properties in one single property. This is called a shorthand property.

The shorthand property for background is simply "background":

Example

body {
    background: #ffffff url("img_tree.png") no-repeat right top;
}

Try it yourself »

When using the shorthand property the order of the property values is:

• background-color
• background-image
• background-repeat
• background-attachment
• background-position

It does not matter if one of the property values is missing, as long as the ones that are present are in this order.

This example uses more advanced CSS. Take a look: Advanced example

Read More