CSS3 Visual Effects Demos Continued

Posted by Neville on July 5, 2011 under How To, Training | Comments are off for this article

The following features will be seen by most browsers, but in particular Chrome, Firefox, Opera and Safari should show:

  • Shadows on the larger text.
  • Shadows on boxes.
  • Rounded Corners on some sections.

These are all generated  from calling values from the edited stylesheet that comes with this theme. If you wish to do the same it would be necessary to add the appropriate snippets of code to your theme’s stylesheet. And then call the from the html code in the post.

Can You See The Shadows?

Albino Kangaroo

Testing CSS in a post

Posted by Neville on June 16, 2011 under Blogging, How To | 3 Comments to Read

Cascading Style SheetThis is a demo of using CSS in a post.

This is ordinary text.

and now

This is indented large text.

The above was made using the style attribute for a paragraph.
The values that were manipulated were:

  • font size
  • font colour
  • margin for the indent
  • font weight

CSS (or Cascading Style Sheet) allows you to play with the way that your post looks.

The  word Cascading refers to the way in which the formatting code is used in a web page like this post.

When the code is interpreted by the browser it happens something like this:

  1. If there are style commands in the Body of the code, the browser acts on those commands. These take priority over the following.
  2. Style commands in the header come into play if not over-ridden by the above. This is called an Internal Style sheet and the code is found in the Head of the page code.
  3. If a separate External Sheet is called on by the page, this determines the attributes that have been coded. These will be acted on, unless called on by earlier Style commands. (In the Head or Body of the page).
  4. Finally, if there are no Style commands in any of the above, the page will be displayed according to the default settings of the browser interpreting the code.

The above is a very  brief overview of CSS, but hopefully helps to begin you understanding of CSS.

Just from the brief example above you may be able to see the possibilities by coding some CSS into your posts. Look for future posts with hints and tips for formatting with CSS style commands.

The experts among you will also be able to do much more than this little example by playing with the code of your WordPress theme.

WARNING: BackUp before playing with the code!

More About Themes: Latest Experiences

Posted by Neville on January 22, 2011 under Blogging, How To | 3 Comments to Read

Changing A Theme Should Be Simple.

The observant reader of this blog will have noticed a change in the way in which it displays the content. That’s a fancy way for saying that I changed the theme.

From that there are a couple of experiences that I should really note, so that you can see that there are several things to consider when changing the theme of your blog.

Before I started searching for a new theme I thought I had stored away things that I did not want to lose if the new theme did not accept them readily. I saved my widgets in the widgets store, so that I could get them back if the new theme did not display them.

I backed up my blog. Just in case something went wrong.

It was all looking good for selecting a new theme, so I went ahead with the process.

When I found that Google Analytics was showing no visits for a about 2 days I wondered if it was such a good idea to change the theme. Had people stopped visiting because they didn’t like the new theme?

But the Who’s Online widget was showing the usual number of visits. So what was happening with GA?

Then the AHA! moment. In the old theme, the GA code was stored in the source code for that theme! Since it was no longer active I had to copy the GA code into the new theme. That fixed it!

At about the same time I decided to take another of my blogs in a new direction, and install a new theme on that one. I remembered the GA code on that one! Lesson learned!

Edit Theme

With the new theme on my other personal blog, I discovered that the theme could have many aspects configured from the dashboard. That makes it much easier to tweak and set up certain features, without having to go into the minefield that can be discovered when manipulating the source code of the theme, as I suggested in an earlier post, to do to tweak your theme.

So, a simple change of theme has provided a couple of useful experiences and things to learn and remember. Blogging is full of these little surprises.

Have you discovered any problems when swapping themes? Add yours in the comments.

Blog Structure: An Overview Part 2

Posted by Neville on January 11, 2011 under Blogging | Comments are off for this article

Big Changes in Appearance but Small Changes in Structure:

Since the publication of Part 1 of this series of posts there have been some big changes in the appearance of this blog.

While working with the way the blog looked for Part 1, I decided that the blog would benefit from a lighter and cleaner appearance. The darker colours of the Choco theme, as seen in the screenshot in the previous post have gone to be replaced by the cooler and cleaner blues of the current theme.

In order to to keep the location of the features in the Header, Main Post Feed and Sidebar sections, it has been necessary to tweak the theme by going into the Theme editor to remove or hide certain features that came with this theme.

And where did I go to find out how to do that? Why one of the earlier posts in this blog, of course.

Now it’s back to the Structure of a Blog.

Pages:

The usual set up for a blog is to have a page that shows the most recent post as the home page. This gives readers a quick way to catch up on the latest posts, and has the most relevant news and information, depending on the focus of the blog.

Blog Page Structure

The Home Page:

So the Home page or the Feed page is just one of the pages in a blog. Depending on how the blog owner Read more of this article »

Blog Structure: An Overview Part 1

Posted by Neville on January 10, 2011 under Blogging, How To | Comments are off for this article

How Is A Blog Structured?

This post should have appeared much earlier in the blog, but as they say in the classics: Better Late Than Never.

Just what are all of the parts that go together to make up a blog?

This question will be answered based on the stucture of this blog and many blogs that I have visited. There will be other ways of stucturing a blog, and many of those will be nothing like the description that follows. That is the beauty of WordPress, in that it can be configured in almost innumerable ways.

Enough of words for this post. Let’s look at a typical blog.

blog structure

Yes, I know it’s this one, but it will do as an example.

Please note the labelled parts, which are explained briefly below. Only the top part of the page is shown and the discussion below is about the front or home page of the blog. This page shows the latest posts, in order from latest to earlier post

A: The Header.

This holds the Title of the blog and often a subtitle. The Title is usually linked to the home page of the blog, so you can come back to the front page of the blog by clicking the title from any page or part of the blog.

B: Page Menu.

This has clickable links to other pages of the blog. The names of the pages are used as the links, so click a name to go to that page. This menu usually shows on every page of the blog.

C: The date this post was published.

The way this is displayed depends on the theme used in the blog. Often it is shown just under the post title along with the name of the author of the post.

D: The Post:

The first one is on the page is the most recent. But not always, as some blogs have set a particular post to always be the first.

A post has a heading which is a link to a separate page (the single post page) that displays just one post at a time, where the reader can usually add a comment. Some blog feeds are set to show just an excerpt from each post and to the read the whole article you  click a link that takes to the single post page.

E: The Sidebar

This important part of the blog can hold a vast range of tools, widgets, links, advertising and lots of other things. These are also displayed on every page of the blog so that they can be accessed very easily.

In the picture above you can just see a small sample of the widgets used in this blog. You can actually see the whole range just by scrolling down this page.

F: An example of a widget.

The example shown is for the link to the APSense Guide Pro. Clicking the image of the cover takes the reader to the sales page for that eBook.

G: The beginning of other widgets and plugins.

You can see the top of the Admin widget, which allows the owner and subscribers to login to thei dashboards. Below that are widgets displaying advertising, sites I have joined, a tag cloud and links to other blogs.

The posts on the structure of a blog will continue in the next few posts.

 

Everything Is Broken: Fixing a Busted Theme

Posted by Neville on December 29, 2010 under Blogging, How To | 2 Comments to Read

Is Your Theme Playing Up?

A few posts ago I showed how I had been tinkering with a theme by playing with the source code. Broken Theme

I did warn readers that messing around in the code can cause problems. I have also mentioned that it is a good idea to back up your blog just in case something goes wrong, especially before you play with the source code.

Tinkering with things can cause problems, just like when I tried to fix my old shed door! Simple solution to that one. Remove the doors.

Despite your best efforts and intentions editing the code on your template (or theme) might just cause unexpected problems, and these can be difficult to trace and fix.

The following strategy might just be the way to get you out of trouble. It has worked for me when I tested it on my test blog.

The strategy for fixing a broken, or misbehaving theme.

First: Back Up your blog. Just in  case the following doesn’t work.

  • Install and activate a different theme.
  • Delete the theme causing the problem.
  • Reinstall that theme again, and activate it.
  • It should now be the active theme, with defaults set, and the problems gone.

Sometimes changing themes causes widgets in the sidebars to be stored in the inactive widgets holding spot. They can draggged back into the sidebar from there, without having to be set up completely again.

Hopefully there’s no need to feel like this:

Everything Is Broken

by Bob Dylan

Broken lines, broken strings,
Broken threads, broken springs,
Broken idols, broken heads,
People sleeping in broken beds.
Ain’t no use jiving
Ain’t no use joking
Everything is broken.

There is often a simple solution that seems to escape us despite trying hard to find it. I hope this one works for you, if you ever need it.

Tweaking A Theme In WordPress

Posted by Neville on November 11, 2010 under Blogging, How To | Comments are off for this article

Did you notice the small difference?

Just before I started to write this post I edited the source code of the theme to make the font size for each post just a little bigger.

That is something that a blog owner at dotrim can do with their blog to. Tweaking your theme is often not possible when using aTheme Edit WordPress blog on a shared, or networked blog, because the Theme Edit option is not available on the dashboard.

Another good reason to have a blog hosted here at dotrim.com.

This post is not going to show how to do simple editing like this, as I wanted to point out this advantage of running a blog hosted here at dotrim.

The big question is Why would anyone want to edit a theme any way?

Well in this instance, I have been happy with the  general appearance of the theme, but when compared with some others, I felt that the text font size was a little small. So a quick little edit of one line of the source code of one of the theme’s files allowed me to increase the text size just a little.

As time goes by I will possibly tweak some other features of the theme. All can be done by using the the Theme Editor option on the dashboard.

When you have your own blog at dotrim, I will be happy to show how simple little edits like these can done.

A word of caution: playing around with source code can cause unexpected and fatal problems, so before I do this sort of editing I experiment with another of my blogs here at dotrim.

Blog Set Up: Changing a Theme

Posted by Neville on November 9, 2010 under Blogging, How To | Comments are off for this article

Changing a Theme: First Steps

Perhaps the first thing a new blogger at dotrim would like to do is to choose a theme that suits their blogging topic.Install Themes

In this post I will outline the process for selecting a theme from the hundreds of free themes that are available to Word Press users.

When a dotrim blog is set up, there are 5 themes provided to choose from, but the blog owner is not restricted to these available themes.

To change a theme to one of those already available:

  1. Open the Appearance Menu in the Dashboard.
  2. Select the Themes menu option.
  3. Select the Manage Themes tab at the top of the page.
  4. Click on any of the available themes to preview it.
  5. Click Activate (top right hand corner) to set that theme OR
  6. Close the preview and return to step 4 to preview another theme.

To Install a different theme:

  1. Repeat Steps 1 and 2 above.
  2. Click the Install Theme tab at the top of the page.
  3. From there you can Search for a theme by keyword, author or tag OR
  4. Use the various filters for colour, style etc.
  5. From the results of your search you can choose to Preview and  Install the selected theme.

There are more things that you can do with installing themes such as adding your own, uploading one from another source and editing a theme to suit your needs, but those tasks are better kept for the more experienced blogger.