Search Form experiments with css

Francky - Search Form experiments with css

Results

Tested in FF2, IE6, Opera9 under WinXP:
valid html | valid css | IE-proof 1 hacky | font-scaling / zooming allowed | disabling (background) images allowed | disabling css allowed…

… but some work for accessibility still remaining;
see for instance TheManInBlue

The Extra Column

I have always wondered how to get an extra column into wp. I normally just call the sidebar and footer from index.php as usual and then if I want a three column layout, put the two columns in the sidebar. e.g.

[/div][!-- end of id content--]
[/div][!--end of id wrapper--]
[!--index.php end--]

[!--include sidebar--]
[?php get_sidebar(); ?]
In the sidebar.php I have two divs, one called leftcol and float this left and the second say rightcol and float it right. (It is a little bit more complicated than that but for ease this is how I will leave it).

Now we finish the index.php by telling it to call the footer:
[!--include footer--]
[?php get_footer(); ?]

However, if I add this line after the call to the sidebar:
[!--include extra.php--]
[?php include (TEMPLATEPATH . '/extra.php'); ?]
Then I can add an extra column without resorting to having in sidebar.php.

Why is this important? Well maybe the opening page is a three column layout which upon opening a post goes to a two column structure. Using the above will help that process.

By the way I have changed the <> brackets for [] just so it doesn’t break the site.

Making a Wordpress Theme your own

Does anyone know of any good sites or tutorials on this subject. I don’t want to use a template or anyone else’s theme or CSS style. Any thoughts?

Take a look at:
Urban Giraffe
How to design your own wp theme
Blank wp Theme
Four blank wp themes

And for completeness:
How to write a wp plugin

Nothing about templating in there but if you get that far give me a shout and help then.

Rounded Corners

I know there is a far better list at the css-d site (rounded corners) but I wanted to list some of the techniques I had found. So here goes:
Look at the source code
Nifty Corners: rounded corners without images (Uses CSS and JS).
In this article, we’ll show how customised borders and corners can be applied to fully fluid and flexible layouts with dynamic content, using sound and semantically logical mark-up.
“Bullet-Proof” Rounded Corners
Liquid rounded corners
Liquid corners playgarden

In order to make the actual corners you can try this:
To create rounded graphics in Photoshop first make a square or rectangle with the rectangular marquee tool. Before you fill it with a colour go to select>modify>smooth. Type in a number - usually between 4 and 12 is good. This essentially rounds the corners for you. Next, (or first) click on the colour palette square in the tools. Make a color you like. Fill your rounded marquee element with that colour.
CSS Rounded Box Generator (Beta)

And there we go. Onto less boxy and more rounded designs. So why is my site so boxy at the moment?

Fonts

Font selection for the Web should be based on a generic font family to ensure an appropriate type style is rendered in any circumstances. Specific named fonts can then be declared in order of preference and tailored for specific platforms, but which to choose? This article compares the most common fonts for Windows, Mac and Unix family systems.

Font Sizes

default: 100%(relative) =1em(relative– but causes a resizing bug in IE if used on the body) =16px(absolute– but IE can’t scale pixel font- sizes)

Applying Styles: Sidebar

Q: Hi, I need some help with this. I am using Wordpress and I would like to get a dotted border around the different categories on the sidebar.

A: Apply the border style to the outer elements, the uo and ol, not to the li’s. The following will get you started.
#sidebar ul, #sidebar ul ol {
margin: 0;
padding: 0;
border: 2px dotted #ccc;
}

If you want the border only on the inner lists, try this instead:
#sidebar ul ul, #sidebar ul ol {
margin: 5px 0 0 10px;
border: 2px dotted #ccc;
}

Web Site Development Resources

Online Payment providers
http://www.electronic-payments.co.uk

Credit cards – www.worldpay.com , www.protx.com , Major Banks
Online Payment Facilities www.paypal.com , www.nochex.co.uk
Online auctions – www.ebay.co.uk

Accessibility
Getting Started: Making a Web Site Accessible
http://www.w3.org/WAI/gettingstarted/

RNIB Web accessibility at a glance
http://www.rnib.org.uk/xpedio/groups/public/documents/publicwebsite/public_webaccesscentre.hcsp

Web Content Accessibility Guidelines 1.0
W3C Recommendation 5-May-1999
http://www.w3.org/TR/WAI-WEBCONTENT/

Web Content Accessibility Guidelines 2.0
W3C Working Draft 11 March 2004
http://www.w3.org/TR/2004/WD-WCAG20-20040311/

Test your site:
http://bobby.watchfire.com/bobby/html/en/index.jsp

Legal Information
Distance Selling Regulations http://www.dti.gov.uk/ccp/consultpdf/distselcon04.pdf
http://www.hmso.gov.uk/si/si2000/20002334.htm
UK Electronic Communication Act (2000) www.uk-legislation.hmso.gov.uk/acts.htm
Data Protection Act www.dataprotection.gov.uk
Comparative Marketing Directive www.marketinglaw.co.uk/open.asp?A=173
www.dti.gov.uk/cii/ecommerce
www.eversheds80.com

Marketing your web site : Links There are many web sites which offer helpful information and tools to help you to build and maintain a web site. The majority of the links below are free and offer a starting point for the marketing of your web site. See how many searches are being made for various keywords or phrases.
www.overture.com/d/USm/adcenter/tools/index.jhtml
www.wordtracker.com
www.google.co.uk – visit ad-centre and select keyword tool
Establish which search engines to submit you web site to.

http://dmoz.org/add.html - an open directory which is free to submit to and also provides data to some of the leading search engines and directories.
www.altavista.co.uk – Basic submit is free
www.google.co.uk – basic submit through dmoz is free
www.hotbot.co.uk – visit http://www.hotbot.lycos.co.uk/submit.html
www.aol.co.uk – submission through Open Directory
http://submit.looksmart.co.uk/submit_homepage.asp?isp=yah – looksmart engine
www.netscape.co.uk
www.freeserve.co.uk
www.inktomi.com
There are a number of search engines available on the internet. These are only a small section of those available.
Search for directories and web sites that may be suitable for listing your business, eg. Try ‘Cornwall Directory UK’ in google to find relevant sources
Many sites offer reciprocal links, you could add a links page to your web site and offer reciprocal links – the more sites linking to you the more popular you are seen as by the search engines.
Generate business through links from Supplier web sites. Many manufacturers have list of retailers on their sites, or if you manufacture – list your retailers. Use the internet as a resource for learning, there are many online guides to building web sites and marketing your business online.
http://www.htmlhelp.com/ - code and articles on HTML programming
http://www.useit.com/alertbox/9605.html - tips on building web sites
http://www.ukonlineforbusiness.co.uk
http://www.seoposition.com - tools to help optimise your web site for improved search engine listings
http://www.isitebuild.com/articles - articles on designing and building a web site including search engine ‘optimisation’.
www.clickz.com – marketing online – a guide to email marketing
www.searchenginewatch.com – search engine information
www.echoecho.com – keyword listings
www.overture.com – keyword searching
www.didit.com – search engine registrations
www.knowthis.com – General and Internet marketing site
www.bidbuddy.co.uk/images/ukser.jpg - how search engine results are passed around
www.searchengines.com – free guides to understanding the search sector
www.roxy.neutralize.com – tools to help you check your listings in search engines
www.sempo.org the Search Engine Marketing Professional Organisation
www.semlist.com marketing service buyers guide
http://sherpastore.com/store/page.cfm/1759

Directories Below is a list of directories, most found within Google.co.uk under cornwall directory uk.

I tend to recommend to initially go for the free links where available, and then to review whether they are working for you before you pay.
(statistics for your web site should be available through your hosting, these tell you your number of visitors, where they came from, where they went on your site, and lots of other interesting and vital information to help you market your site effectively)

www.north-cornwall.co.uk
www.cornwall-homepage.co.uk
www.cornwall.health-club.net/
www.cornwall-pages.co.uk/
www.chycor.co.uk
www.celticcornwall.com
www.cornwall-devon.com
www.go-cornwall.com
www.beautiful-cornwall.co.uk
www.uk-westcountry.co.uk
www.cornwallsearch.com
www.thisisthewestcountry.co.uk
www.artsroundcornwall.com
www.cornwall-calling.co.uk
www.ecornwall.com
www.falmouthtown.co.uk
www.netpz.co.uk
www.southernuk.com/
www.thisiscornwall.co.uk
www.cornwall-search.co.uk
www.cornish-links.co.uk
www.connexions.co.uk
www.cornwall-online.co.uk
www.cornwall.gov.uk/
www.cornwall-calling.co.uk
www.cornwallcam.co.uk
www.cornwall.net
www.cornwalltouristboard.co.uk
www.cornishlight.co.uk
www.cornwall-info.co.uk/
www.destination-cornwall.co.uk/
www.art-cornwall.co.uk/
www.cornishman.com
www.cornwallpictures.co.uk
www.gardensincornwall.co.uk
www.1-all.co.uk/
www.shimbo.co.uk/
http://www.st-ives.uk.com/
www.eatoutcornwall.com

PHP and MySQL on your Mac

Quite simple this really! Go here:

This is the homepage of Marc Liyanage. You probably came here for the software in the Mac OS X Software category…

Excellent site.

Manic Web Server

This is good for a laugh. If you have ever wondered what a web server thinks about, go to this address
Manic Web Server.
Then add anything after the address and enter. Your goal is to get the “404 page not found” message. Be prepared to read awhile the server rambles on a bit.