WordPress Blog iPhone Breadcrumbs Issue Tutorial
Today’s WordPress Blog issue is device size specific, in our experience just affecting the (optional functionality) “breadcrumb” links to blog postings before or after the current blog posting the user is reading, not showing them for this iPhone device widths.
Given the circumstances here, we just want to start showing some part of the “breadcrumb” link (wording) content, and not insist on it being shown fully, which is a far better bet for those wider and higher devices and computers. Counterintuitively, the CSS solution in the blog’s TwentyTen theme’s header.php increases those “breadcrumb” link font sizes, and various other CSS improved the situation, as shown in today’s tutorial picture …
<?php echo ”
<style>
@media only screen and (min-device-width: 320px) and (max-device-width: 765px) and (orientation: portrait) {
.nav-previous a { z-index:187; font-size:24px; opacity:0.6; font-stretch:condensed; background-color:rgba(250,218,221,0.7); }
.nav-next a { z-index:187; font-size:24px; opacity:0.6; font-stretch:condensed; background-color:rgba(184,188,134,0.7); }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 765px) and (orientation: landscape) {
.nav-previous a { z-index:187; font-size:24px; opacity:0.6; font-stretch:condensed; background-color:rgba(250,218,221,0.7); }
.nav-next a { z-index:187; font-size:24px; opacity:0.6; font-stretch:condensed; background-color:rgba(184,188,134,0.7); }
}
</style>
“; ?>
If this was interesting you may be interested in this too.
