dyadica.net

Fun and Games in the Dyadic Sea

Archive for the ‘css’ Category

permalink image comments image
Tuesday, 27 January '09: Revamp Nearly Complete

With the ps-wii-elite engine revamp  95% complete, lets have at what once was so.

A Bit of History

Before I introduce some of the new features and site ethos, here is how things used to be: theme archive

dyadic-night-splash

The dyadic-night implementation (above) was really where ps-wii-elite really started to take shape. Driven by blogging and wordpress experience the theme matured to be both crisper and more accessible. Read..

Tags: , , ,
permalink image comments image
Tuesday, 27 January '09: Wordpress Gallery CSS

Time for another wordpress mod driven by the ongoing ps-wii-elite theme revamp:

Since the advent of wordpress 2.5 the built in gallery system has a habit of deploying a “nice” chunk of bespoke css slap bang in the middle of your web page, where it cannot be reached/styled by normal methods.

Many folks have developed plugins to remedy this factor however I prefer to remove it completely, time for another wordpress hack:

wp-includes>media.php  contains the evil code around line 641, detailed as follows:

$output = apply_filters('gallery_style', "
<style type='text/css'>
.gallery {
margin: auto;
}
.gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: {$itemwidth}%;}
.gallery img {
border: 2px solid #cfcfcf;
}
.gallery-caption {
margin-left: 0;
}
</style>
<!-- see gallery_shortcode() in wp-includes/media.php -->
<div class='gallery'>");

Simply edit this to equal the following, thus removing the css:

$output = apply_filters('gallery_style', "
<!-- see gallery_shortcode() in wp-includes/media.php -->
<div class='gallery'>");

The gallery can now be styled in the usual manner using the following definitions:

.gallery {}
.gallery-item {}
.gallery-icon {}
.gallery-caption {}

Simple eh.. I have left things pretty raw at this stage as I am planning to add some thickbox deffinition functionality at this point.  This was another Wordpress hack brought to you by dyadica.net.

Tags: , , ,
permalink image comments image
Sunday, 11 January '09: Adding a classified span tag to wordpress

With my ongoing theme revamp I have decided that I would like to have the numeric’s of my ordered lists to be a separate color from the content. Though there are methods for achieving this with newfangled css this causes some browser compatibility issues so I believe.

grr have lost the link….worked fine in FF3 but not IE..

The easiest method therefore is to wrap the content in an additional tag for standard css styling. For this purpose I have chosen to use span tags, however as this functionality might be quite commonplace I also decided to add a new quicktag to wordpress to cater.

When you are editing a post or writing a new post in WordPress, you might have noticed those buttons above the editing box. They add WYSIWYG type functionality to the WordPress editor for common functions such as bolding, italics and linking. WordPress refers to these buttons as Quicktags.

quicktags

If you have a function that you use often it is very simple to add it to the  HTML editor Quicktag bar. For this example, I am going to add a button that creates a span tag and I’m going to expand upon this a little by adding facility for a css class within the tag, just in case it might be needed. Read..

Tags: , , , ,
permalink image comments image
Wednesday, 27 February '08: New Color Scheme

There have been a few changes here at dyadica.net over the last few days, primarily involving color. Cornily entitled the abyss I’m about 80% through the theme revamp, however doubt is already setting in.

Initial focus behind the current change was to combat some of the old themes non intentional contrast issues, that have been highlighted by a few folks. For reference and comparison here is a picture of the old setup:

dyadicanet-grey.png

Now I really liked the gray theme however feedback indicated that things could look a little washed out… ho humm. Read..

Tags: , , , ,
permalink image comments image
Sunday, 20 January '08: The Paper Trail 0.5

With the advent of this weekends spring clean there was need to revisit the old paper trail. Upon changing the Pages page layout to one of full width I discovered a few XHTML W3C issues.

This was easily fixed however with simple modification to the pollChildren() function to embed the embedded unordered lists within link tags (duh).

As a bonus however I have now a defined entry point for the attachments script within pollChildren().

I get round to both explaining and developing this soon as the spring clean is completed.

With the W3C issues addressed focus turned to the paper trails css which now had to be modified to cater for the additional <li> tags.

The following Images detail a few examples:

paper-trail-css-b.jpg

I tried out numerous css designs in order to create a visibly usable system. I opted for the page boxes to be non symmetrical (above image). Read..

Cats: Web, css, php, wordpress
permalink image comments image
Monday, 20 August '07: Valid XHTML 1.0 Transitional!

Dyadica.net Valid XHTML 1.0 Transitional!
Dyadica.net Valid CSS

Tags: , , , ,
permalink image comments image
Monday, 2 July '07: Public Smoking Banned in UK

I must comment, I need to comment, I can’t comment, I’m too upset.

Tags: , ,
permalink image comments image
Monday, 11 December '06: How to add Live Bookmarks

Another snipet for you. Put the following between thehead tags on your website:

?
And…

Cats: css
permalink image comments image
Sunday, 10 December '06: CSS IE7 Hack

A little snippet for those of you who are desperate for a CSS hack for IE7. It turns out that IE browsers do not support the use of :lang selector. To take advantage of this we can add lang to the body tag thus:

<BODY lang="en">

T hide a style eg for a HR we can create it like so:

*:lang(en) HR { margin-top:1000px; }

Warning: Safari also does not support this attribute.

Cats: css

poll categories

css | xhtml | dyadica.net © admin 2010 | powered: wordpress | fuel: ps-wii-elite | top | sign-up