Wordpress Custom Fields, plus Compass/Sass tip: CSS inline images

July 22nd, 2010
Wordpress Custom Fields, plus Compass/Sass tip: CSS inline images

Set out to learn something…and I did. Now its your turn

I wanted to create images that I could use for each post showing that it belonged to a certain type of category. You look at the image, and without reading the title, you would say “Oh, this post relates to Wordpress.” Same with jQuery, Blogging in general, or whatever category I come up with. Something my readers would come to recognize over time. I also wanted to be able to do it without having to stick it in manually in the post like I do with the other images I stick in articles. If you are on the home page you will already see this. That is the one I came up with for articles relating to Wordpress.

Now, I can’t take credit for what I am about to show you. I learned how to do this fromJustin Tadlock’s blog, but I wanted to spread the love. This was the best tutorial I found on the subject.

Just 10 Easy Steps!

Here is my quick and dirty paraphrasing of it. Meaning, do EXACTLY AS IT SAYS BELOW.

Read the rest of this entry »

Tags: , ,
Posted in Sass/Less/Compass, WordPress | No Comments »

Blogging…all in a night’s work!

July 21st, 2010
Blogging…all in a night’s work!

It’s not just publish and you’re done

Tonight I thought I would take you through what it actually takes to blog. I mean the day to day crap. If you think it’s just write a post, publish and done, then you are seriously mistaken. There is a ton of other things involved that go on to keep a blog going. I’m proud of what I have accomplished so far, but there is a lot that goes on behind the scenes here at The Web Machine, and I’m sure almost any other blog that has effort behind it. Besides the writing, there is the constant tinkering, rearranging, testing, security, moderating…the list goes on and on.

So if you are thinking about starting your own web development blog, read on, and then see if you are up to it.

Read the rest of this entry »

Tags:
Posted in Blogging | No Comments »

Using jQuery’s hover() event to the fullest

July 20th, 2010
Using jQuery’s hover() event to the fullest

The problem

Today at work I was given the task of using jQuery to create a very specific effect. I have an unordered list with three list items. When the user rolls over one of them, the item gets a class which sets the background to a new color, while any other item that has that class, has it removed. On top of that, if the container the list is in loses focus (meaning the cursor leaves the container), the last list item hovered on should retain the background changing class. On top of THAT, whenever one of those said list items is hovered over, one of three content divs below it should go from hidden to visible. Oh, and I have to have the second item started off as looking like the hover state. This one took me a while to figure out. I could get the normal rollover, but the keeping the class thing when the list item lost focus through me for a loop.

Click here to take a look at the final working jQuery. You’ll see what I was trying to do if you roll over and out and what not.

Read the rest of this entry »

Tags: ,
Posted in Javascript, Web Development | No Comments »

Paprika to get organized, Microdata, and ranting

July 15th, 2010

Get organized

Paprika logo Let’s start with Paprika. I know in my post “Creating your own web dev tool kit – Part III: Apps that help” I told you about todotweet.com. It is still a great little twitter app, but I have found that Paprika suits me better. It is just another little note taker type thing that lets me create projects with to do lists in them.

Paprika screenshot

As you can see from this little screen I have a project name of The Web Machine, an h1 tag that is the Things to do…, 3 tags (Design, Coding, and Articles), and something to do under each. Paprika is so easy to use, and along with the base amount of features that I want, I’ve made it my new to do list app. You do have to create an account, which is also stupid easy (like 4 fields to enter), after which they give you your own url. Login, and you are off.

Read the rest of this entry »

Tags: ,
Posted in Cool Links, Web Development | 1 Comment »

Real example of jQuery’s replaceWith()…and Ext’s method

July 14th, 2010

What the hell is Ext?

That is what you are asking yourself, right? It’s another javacsript library, which I have gotten into many an argument over why one would use it over another library. Personally, I find it to be more like writing straight javacsript (which I suck at). My point isn’t to get you to use it, because I don’t care. I love jQuery, and that is that. I’ll show you the difference in this post/article between how jQuery would do something versus how Ext would do it, because I HAD to do it in Ext. On to what I had to accomplish.

The Problem

Here is the set up: I have a hard-coded div with two links in it, I am not allowed to touch the actual HTML page itself (meaning the myPage.html), but I do have to change the href of the first link, and the text that displays in it.

For you jQuery newbies, I’m going to be using first() and replaceWith() to do this, and you will be amazed by the simplicity of it. Because I am not all that familiar with Ext Core javascript library, I actually had to write this in jQuery first and then translate it over. This though is much easier than when I tried doing that with my slider.

Read the rest of this entry »

Tags: ,
Posted in Javascript | No Comments »

  1. Pages:
  3. 1
  4. 2
  5. 3
  6. 4
  7. 5
  8. 6
  9. 7
  10. 8
  11. ...
  12. 24