Knowledge Base

Right To Left Language Support

October 2, 2012 by Yanni Nurlaela in Customization

Have you heard about RTL or LTR term, RTL means that Right to Left and LTR means Left to Right. Maybe from this article you will have an idea to modify your theme which use RTL language to support it.

Here is the LTR style:

Default theme style for all themes usually show and writes from left to the right, but what about some languages like Arabic, Hebrew and plenty of others go from right to the left? HTML provides a property for the html element named dir that indicates whether the page is LTR (left to right) or RTL (right to left). Just try to open your header.php, while most of the html tag is on this file for all themes, add RTL codes for the html tag.

&lt;html dir="rtl"&gt;

The code above will show the site from right to the left, and when it support for a direction properly in CSS, add this codes at style.css or better put at custom.css for additional css code at the theme.

input {direction: rtl;}

Try this simple way to make languages plan from right to left, and get this example result below for the RTL direction below.

Set the direction property will make the page working for the standard HTML tags, but it can’t switch a CSS element with float: left to float: right or change an absolutely positioned layout. To make more complex layouts work, you will need a new style sheet. You can modifies the rest style from here for RTL direction to make it neater and look nicer.

Display Post Title With Another Breadcrumb Style

October 2, 2012 by Yanni Nurlaela in Customization

http://colorlabs.co/WbaM3q

By default a breadcrumb that displayed at Google Search result will displayed like image below (The All-in-One Bundle is Back! | Blog | ColorLabs & Company). Sure, one of you prefer to have post title | post category instead of the default one.

You can modify the url when the result is listed, here is some example.

The first thing you have to do is open file header.php at your theme folder then find this code :

<title><?php colabs_title(); ?></title>

Change with this codes :

<title>
<?php if ( is_single() ) { the_title(); 
$category = get_the_category(); echo ' | '.$category[0]-&gt;cat_name; }
else{ colabs_title(); } ?>
</title>

The result will be like this : “This Is My Title | Category of Post”

Another Example Codes :

<title>
<?php if ( is_single() || is_page() ) {
 $category = get_the_category(); echo $category[0]-&gt;cat_name; 
echo " | "; bloginfo( 'name' ); echo " | "; the_title(); }
else{ colabs_title(); } ?>
</title>

The result will be like this : “Category of Post | Site Information | This is My Title”

Pagination Issue

June 20, 2012 by Yanni Nurlaela in Page Views

http://colorlabs.co/M5V9YV

Not every query_post(...) works as weel for pagination, sometimes it works for pagination when no need to use query_post(...) and just put this code as weel to show the list of the post :

And the other case is sometimes client site has no work for pagination when using our codes below :

query_posts( array(
'offset' => get_option('colabs_countpost'),
'cat' => $_cat
));

So we just need to implement this modification codes for query_post(...) to make pagination works as well :

query_posts( array(
'cat' => $_cat,
'posts_per_page' => get_option('colabs_countpost'),
'paged' => $paged
));

Video/Image Doesn’t Show at Single or Front Page

June 12, 2012 by Yanni Nurlaela in Thumbnails

http://colorlabs.co/JYMClb

For some reasons, there’s might be this problem that video / image didn’t show when you view at single page or even at front page, Just to make that you had check “Show Thumbnail at Single Page” when you go to > Dashboard > Single Page Settings. The other posibility it’s because not we use the same hosting, some of hosting need to check it first to make the video / image appear.

Link For Caption Text

June 12, 2012 by Yanni Nurlaela in Page Views

http://colorlabs.co/JYMCl9

Some of text at caption might be use a hyperlink, this can not be done while you use directly “Hyperlink” button for the tex, because wordpress will render as normal text again without link. You can use and try this way below to make it works.

Try to use this :
Lorem ipsum dolor sit amet, {link:colorlabsproject.com}consectetuer adipiscing elit.{/link} Nam cursus. Morbi ut mi.

Then put the following code in footer.php , right before </body></html>

<script type="text/javascript"> jQuery().ready(function() { jQuery("p.wp-caption-text").each(function(n) { this.innerHTML = this.innerHTML.replace(new RegExp("{link:([^}]*)}([^{]*){/link}"), "<a href=\"$1\">$2</a>"); }); }); </script>

Special Characters Issues

June 12, 2012 by Yanni Nurlaela in Page Views

http://colorlabs.co/JYMCl5

There are many characters that used for the content, and some of it might be use an ASCII code and describing 128 characters, but not all of them can appear nicely. Some of the issue might be show the confused character when using a character for foreign language letters, like Greek, French, Spanish, etc. or might be list of foreign language text letters, symbols and characters and their Alt codes. Umlauts, diacritics, acute accents, breve, circumflex letters, upside-down question/exclamation and other. Small capital letters. Or maybe it show a black diamond question marks.

Even if they are fully support with UTF-8 and Unicode, a browser still not know how to display the character well. Older browser may also showing like an ? and blank boxes more often.

All thise problems caused by text being submitted in one character set and viewed in another.

Try to make sure that every page on your website uses UTF-8, or try to check this after the <head> tag :

<meta charset="UTF-8">

<meta http-equiv="Content-type" content="text/html; charset=UTF-8">

You can also specify UTF-8 in your MySQL tables, though to fully use this feature, you’ll need to develop it. For the additional note that you need to check and implement back-end to ensure data is arriving in the correct format.
Internally, browsers use Unicode to represent characters

Change Site Title Using a Logo

June 12, 2012 by Yanni Nurlaela in Customization

http://colorlabs.co/JYMAK9

For BloggingNews theme, our default style for the logo is using a site title. But somehow, some of you might be wanna use own logo to change the site title instead. You can try doing step by step to make it different by using your own logo :

1. Go to Settings > General > remove the “Site Title “

2. Open file wp-content\themes\bloggingnews\header.php , find open & close tag for “logo”

3. Change all codes between <div id=”logo”> with this code below :

Use your own link file for the image

4. Now add this css code at BloggingNews > Custom File Editor > custom.css
.logoImg {
margin-top: 40px; /*change with you own style position */
max-width: 350px; /*maximal width for the logo image */
}

Default Image, Show Double Image

June 12, 2012 by Yanni Nurlaela in Thumbnails

http://colorlabs.co/JYMCl7

At Arthemia, when you use default image for the thumbnail, sometimes it will show double image when it publish. There’s a default image and featured image as a thumbnail, Jus go to Thumbnail Settings and deactive function for “JQuery Lightbox”

Create Image For Category Bar

June 12, 2012 by Yanni Nurlaela in Customization

http://colorlabs.co/JYMAKb

It’s spesifically for Arthemia-Premium theme, when you see that there’s a category bar wich you can setting wich color for each category bar. There’s another style to make it look more better, that’s create image for each category bar. You can make it work by add this code below at functions.php

remove_filter('pre_term_description', 'wp_filter_kses');

After you add that line, you can see at category description for category setting, that you can input image url at this field.

The example site that use image for category bar.

Show the Excerpt

May 18, 2012 by Christian Ningtyas in Page Views

http://colorlabs.co/KPob8U

There’s much style to show the content, full content or even excerpt with link. Here’s some example code for each style :

<?php the_content(); ?>

Means that this will show all the content

<?php the_excerpt(); ?><a href="<?php the_permalink() ?>"><?php _e('Read the full story »','(theme name)'); ?></a>

It will show the excerpt with “Read More” link, you can change the red more text by your own style

There’s another style / function to show the excerpt by your length setting, this might be you can setting how many words that show for the excerpt.Just open theme-functions.php , and add these code function (make sure there’s not the same function for it) :

function excerpt($limit,$text) { global $post;

$output = $post->post_excerpt; if ($output!=''){ $excerpt = $output; }else{ $excerpt = explode(' ',get_the_excerpt(), $limit); array_pop($excerpt); $excerpt = implode(" ",$excerpt).$text; } echo $excerpt; }

After you create those function, you can call the excerpt using this code below at the current file :

<?php excerpt(40,''); ?> /*the example, the excerpt length will show 40 words*/

Thumbnail Image Disappears

May 18, 2012 by Christian Ningtyas in Thumbnails

http://colorlabs.co/O2BzKI

There’s a posibilities if this issue happen :

Timthumb version is Outdated, you need to update timthumb version to higher than 2.8 or the newest version
Image URL using from an external site, try to active ALLOW_EXTERNAL_SITES at timthumb.php
Change permission for upload & script folder to 755

Image Allignment Doesn’t Work

May 18, 2012 by Christian Ningtyas in Thumbnails

http://colorlabs.co/O2BGpD

Each theme on each site has a different kind rewrite code, sometimes it works in X site, but not at Y site. In this case, the example is for image allignment. When you have a problem for image alignment, that the image not align properly. You can add these codes at style.css or using dashboard > custom.css

Here’s the example codes :

img.alignright {float:right; margin:0 0 1em 1em} img.alignleft {float:left; margin:0 1em 1em 0} img.aligncenter {display: block; margin-left: auto; margin-right: auto} .alignright {float:right; } .alignleft {float:left; } .aligncenter {display: block; margin-left: auto; margin-right: auto}

Make sure there’s not the same class for each.

Find solutions for top issues, common error messages and troubleshooting guides

Right To Left Language Support

Display Post Title With Another Breadcrumb Style

Pagination Issue

Video/Image Doesn’t Show at Single or Front Page

Link For Caption Text

Special Characters Issues

Change Site Title Using a Logo

Default Image, Show Double Image

Create Image For Category Bar

Show the Excerpt

Thumbnail Image Disappears

Image Allignment Doesn’t Work

Recent Blog Posts

Blog Topics

Recent Tutorials

Twitter

Facebook Friends

ColorLabs

Becoming a Member

Support

Elsewhere

Subscribe to Our Newsletter

Knowledge Base

Find solutions for top issues, common error messages and troubleshooting guides

Recent Blog Posts

Blog Topics

Recent Tutorials

Twitter

Facebook Friends

ColorLabs

Becoming a Member

Support

Elsewhere

Subscribe to Our Newsletter

Contact Us