Archive

Posts Tagged ‘WordPress’

Artefino Surface Design Site Launched

Tuesday, July 20th, 2010

We just published the Artefinosurfacedesign.com website this past week and have been getting great feedback.  It’s a WordPress based site that uses the SimpleViewer Pro slideshow software.  Jimmi Lou Stack is a gifted painter with an eye for detail as you will see in her work (and website).

Integrating an Accordion Menu into WordPress with a cformsII plugin

Tuesday, December 22nd, 2009

These challenges arose while I was building a site for Caliber Hospitality.  This article is more of a series of notes about how certain challenges were overcome and is geared toward other web designers working with WordPress.

WordPress and the JavaScript Accordion Menu

caliber.jpg Integrating WordPress with the JavaScript Accordion Menu was first a matter of finding the correct menu coding that would not break WordPress. My first try failed, but then after some perseverance, I came across this JavaScript Accordion Menu (http://www.leigeber.com/2008/05/horizontal-javascript-accordion-menu/) and it worked.

When creating WordPress sites and/or custom templates, I like to begin with the WordPress Default Template and then strip it down and customize it from there. Because there were to be several of these accordion menu’s in the site, that meant creating a separate template for each page with an accordion as they were all to be different. The accordion menu images were all placed via CSS as background images.

WordPress + Accordion Menu + cFormsII Plugin

Another roadblock came with the contact forms living inside the sliders. The contact forms (http://www.deliciousdays.com/cforms-plugin/) were detecting their size on load which was not relevant to their actual size once the page was loaded. When the page did load the contact forms where an illegibly squished pile of text. I had hoped just adding a fixed width to a div tag would solve the problem, but it wasn’t going to be that easy. I overcame this by placing an iframe in the page and that seemed to do the trick. I created separate pages in WordPress for the iframe content, and then used an exclude to keep those pages from displaying in the navigation.

I was no longer able to use WordPress’ Visual Page Editor with the iframe coding as it would strip the iframe code when switched to Visual mode. This was a drag for the client, but I didn’t see another way around it.  I think hard-coding the iframe tags into the page template would be a good solution to keep the Visual Editor as an option.  Of course, the contact form would have to be in one of the first or last sliders to make this work.

New Website for Caliber Hospitality

Tuesday, December 22nd, 2009

caliber.jpg I recently finished a website for Caliber Hospitality.  This site had been designed by another designer, and was brought to me to build.  The client was interested in using WordPress as a content management solution.  At first I wasn’t sure if we could get the slider functionality to play nicely with WordPress.  Whenever  you start adding different JavaScript based tricks/features, you run the risk of one of them breaking the other one.  I found a way to get them to play nicely and the end result of the site came out to be a success.

The Power of CSS

Wednesday, September 2nd, 2009

Jason did a guest blogger appearance at redheadwriting.com this week. Read his article titled “The Power of CSS” and find out what CSS can do for you.  It’s written so a designer or average Joe will understand.  Erika has many other interesting and informative articles on the redheadwriting.com site.

Here’s the link one more time for you!

The Power of CSS

Read it, tweet it, then sign up to become a fan on Facebook.

Adding images and slideshows to WordPress

Sunday, January 25th, 2009

There are (currently) two ways to add images to your pages through WordPress.

  1. One way is through the Add Media Icon which is just right of the Upload/Insert just above where you put your content into a post or page.add an image First you’ll browse for your image.  You’ll then need to decide whether or not you need the image resized and/or a thumbnail created.  Resizing your images is the norm for web use, so if you haven’t done so already, you’ll want to keep that box checked.  The default 640 px is a good starting point.  I normally do mine for 700 px.  Keep in mind that most screens are between 1000 px and 1400 px wide.  If the pic is going to be on the bigger side, it may be best to display a thumbnail that can be clicked on for a larger image.  The next step is to insert the image into the post.  You’ll want to decide if you want to display the image at full size, or the thumbnail if you created one.  You also want to decide if you want the image aligned left or right or center.  Keep in mind if you align the image, the text will wrap around it.  Normally that’s a good thing.  Often people have a tendency to center images or headings, but this is a design no no unless the whole page is already centered.  You want to keep your alignments consistent for text.  In most cases it will be all left or centered.  That said, aligning an image to the right will not throw off how the page looks if the text is all left aligned.  You just don’t want to mix centered content with left aligned content.  The next step will be to push the insert into post button.  Then you’re all set.  The code has been created for you.  If you click on the HTML tab, it will look something like this:
    <img class=”attachment wp-att-214 alignleft” src=”http://visualadventures.com/blog/wp-content/uploads/2009/01/wordpress_image.jpg” alt=”add an image” width=”298″ height=”331″ />
  2. The other way is via the NextGen plugin.  This site has a good description of how to use the NextGen Plugin. http://www.jennmearswebdesign.com/2008/08/13/using-the-nextgen-gallery-plugin-part-1/
    The NextGen button will allow you to insert a slideshow, an image, or an image list.  This is a great way to display a bunch of images at once.  You can create a gallery, and then select that whole gallery to be displayed in your page or post.

Additional Information

To Blog or Not to Blog

Thursday, December 11th, 2008

Six Reason Every Small Business Should Blog

This is a convincing article about why to blog. At Visual Adventures, we have been building almost all of our sites lately as custom designed WordPress blog sites. For about the same amount of time it takes to create a regular website, you can have one with a content management system, a blog, photo galleries you can manage, and lots of other options available for this popular software.

In case you haven’t noticed lately, the search engines love blog articles. The majority of search results I end up on these days are blog articles. That is a huge reason alone, why you might want to consider a blog. Read the article to find out more!

WordPress blog sites

Monday, September 22nd, 2008

Visual Adventures has been creating websites using WordPress (wordpress.org) both for blogging and as a content management system for regular pages.  This software is wonderful as it gives you the ability to blog and manage your web pages without having to learn two different pieces of software.  There are lot’s of great plug-ins that go along with WordPress enabling you to do lots of cool tricks.  The Visual Adventures web site has recently been integrated into WordPress along with some of these other sites that we’ve built lately.