Kenton Web Design Studio https://www.kentonwd.com Tue, 25 Oct 2016 15:15:56 +0000 en-US hourly 1 https://wordpress.org/?v=5.4.1 Font Resizing, Cufon and Javascript https://www.kentonwd.com/font-resizing-cufon-and-javascript/ https://www.kentonwd.com/font-resizing-cufon-and-javascript/#respond Wed, 23 Oct 2013 15:13:04 +0000 https://www.kentonwd.com/?p=15947 It’s always an interesting project or a fix when it comes to putting 3 elements on a web page together and making them work. This is something that just a few minutes came across my desk as we do accept from all sources the small quick project to complete and help out our customers. Client: The client is building a website and was looking to have the font resize option using Javascript or jQuery implemented, however things became tricky with using Cufon for replacing elements such as headers, paragraphs and links with non-standard font. Now for those that know this, it wasn’t some how as simple as a 1, 2 and 3 fix. Only because the original script wasn’t written to force the re-size of font-size on all elements but rather one element and there isn’t really a place that you can Google this stuff to without actually doing a trail and error. This was the case, so we went to work. Solution: The solution was simple, rewrite a new javascript coding that would define all wanted elements on the page; <script type=“text/javascript”> function increaseFont() { jQuery(‘p,h1,h2,h3,h4,#myslidemenu li a,.blog-post h2 a,.slider1Image span strong’).each(function(){ var oldf = parseInt( jQuery(this).css('font-size’) ); jQuery(this).css({ […]

The post Font Resizing, Cufon and Javascript appeared first on Kenton Web Design Studio.

]]>
It’s always an interesting project or a fix when it comes to putting 3 elements on a web page together and making them work. This is something that just a few minutes came across my desk as we do accept from all sources the small quick project to complete and help out our customers.

Client:

The client is building a website and was looking to have the font resize option using Javascript or jQuery implemented, however things became tricky with using Cufon for replacing elements such as headers, paragraphs and links with non-standard font. Now for those that know this, it wasn’t some how as simple as a 1, 2 and 3 fix. Only because the original script wasn’t written to force the re-size of font-size on all elements but rather one element and there isn’t really a place that you can Google this stuff to without actually doing a trail and error. This was the case, so we went to work.

Solution:

The solution was simple, rewrite a new javascript coding that would define all wanted elements on the page;

<script type=“text/javascript”>
function increaseFont()
{
jQuery(‘p,h1,h2,h3,h4,#myslidemenu li a,.blog-post h2 a,.slider1Image span strong’).each(function(){
var oldf = parseInt( jQuery(this).css('font-size’) );
jQuery(this).css({
'font-size’ : oldf + 2 + 'px’
});
});
}

</script>
<script type=“text/javascript”>
function decreaseFont()
{
jQuery('p,h1,h2,h3,h4,#myslidemenu li a,.blog-post h2 a,.slider1Image span strong’).each(function(){
var oldf = parseFloat( jQuery(this).css('font-size’) );
jQuery(this).css({
'font-size’ : oldf - 2 + 'px’
});
});
}
</script>

Then make sure that those elements are processed by Cufon with the non-standard font in use;
<script type=“text/javascript”>
Cufon.replace('h1’) ('h2’) ('h3’) ('h4’) (’#myslidemenu li a’,{hover:true}) (’.blog-post h2 a’,{hover:true}) (’.slider1Image span strong’);
</script>

Last but not least, make sure that the Cufon.replace or Cufon.refresh is properly set within the javascript of the replacement.

<script type=“text/javascript”>
function increaseFont()
{
jQuery('p,h1,h2,h3,h4,#myslidemenu li a,.blog-post h2 a,.slider1Image span strong’).each(function(){
var oldf = parseInt( jQuery(this).css('font-size’) );
jQuery(this).css({
'font-size’ : oldf + 2 + 'px’
});
});
Cufon.refresh();
}

</script>
<script type=“text/javascript”>
function decreaseFont()
{
jQuery('p,h1,h2,h3,h4,#myslidemenu li a,.blog-post h2 a,.slider1Image span strong’).each(function(){
var oldf = parseFloat( jQuery(this).css('font-size’) );
jQuery(this).css({
'font-size’ : oldf - 2 + 'px’
});
});
Cufon.refresh();
}
</script>

Basically what the Cufon.replace or Cufon.refresh in the very above code snip does it calls each java element depending on whether you are decreasing or increasing the size of your font and then runs the Cufon.refresh. You could also do Cufon.replace with elements or Cufon.refresh with elements if there are only specific ones you would like to refresh on as you increase the font. If you use Cufon.refresh() or Cufon.replace() it will run through all elements. Elements being H1, H2, DIV, links, etc…

I’m glad I’ve got the chance to work on this and the client walked away very happy. So am I. Looking forward to another challenge.

The post Font Resizing, Cufon and Javascript appeared first on Kenton Web Design Studio.

]]>
https://www.kentonwd.com/font-resizing-cufon-and-javascript/feed/ 0
Website Speed, WordPress and HTML https://www.kentonwd.com/website-speed-wordpress-and-html/ https://www.kentonwd.com/website-speed-wordpress-and-html/#respond Sun, 13 Oct 2013 15:07:11 +0000 https://www.kentonwd.com/?p=15943 At Kenton Web Design Studio we are known for knowing the tricks that we can implement and have implemented other tweaks into our servers to really boost the speed of website on WordPress or just HTML to render. Since we’re building these new server for Kenton Networks from the group up, beefing up the performance, speed and security, we’ve asked a few of our clients to give it a bench mark through online resources. Here’s what we’ve came up with going through half the tweaks; Not bad, if you know us, we will be after 100% as our mission of success, here’s another example; Little slower, not what we would like to see, but as I’ve mentioned, we’re only through half the tweaks on the new server. We do like so far what we see with about a hundred websites on this server and comparing that to few other services such as GoDaddy, HostGator or even WPEngine. We love WPEngine, no offense guys, but we all try to satisfy our customers. Visit, www.kentonwebdesign.com or www.kentonnetworks.com for more info. You can also follow us through this blog on Tumblr or on Twitter at @kentonnetworks.

The post Website Speed, WordPress and HTML appeared first on Kenton Web Design Studio.

]]>
At Kenton Web Design Studio we are known for knowing the tricks that we can implement and have implemented other tweaks into our servers to really boost the speed of website on WordPress or just HTML to render. Since we’re building these new server for Kenton Networks from the group up, beefing up the performance, speed and security, we’ve asked a few of our clients to give it a bench mark through online resources. Here’s what we’ve came up with going through half the tweaks;

tumblr_inline_muscvvogeg1r89n1u

Not bad, if you know us, we will be after 100% as our mission of success, here’s another example;

tumblr_inline_muscx1dcve1r89n1u

Little slower, not what we would like to see, but as I’ve mentioned, we’re only through half the tweaks on the new server. We do like so far what we see with about a hundred websites on this server and comparing that to few other services such as GoDaddy, HostGator or even WPEngine. We love WPEngine, no offense guys, but we all try to satisfy our customers.

Visit, www.kentonwebdesign.com or www.kentonnetworks.com for more info. You can also follow us through this blog on Tumblr or on Twitter at @kentonnetworks.

The post Website Speed, WordPress and HTML appeared first on Kenton Web Design Studio.

]]>
https://www.kentonwd.com/website-speed-wordpress-and-html/feed/ 0
Nginx + Varnish + HHVM + WordPress = WP Super Fast https://www.kentonwd.com/nginx-varnish-hhvm-wordpress-wp-super-fast/ https://www.kentonwd.com/nginx-varnish-hhvm-wordpress-wp-super-fast/#respond Wed, 25 Apr 2012 14:48:24 +0000 https://www.kentonwd.com/?p=15933 Every client we’ve worked for so far, wants their website to load super fast. No surprise and it’s no secret that Google penalizes your Google search result listing based on your website performance. If your website is loading over 3 to 4 seconds or more, you’ll be back in the line on Google’s list. There’s many aspects that you can look at to improve the speed and page rating of your website, there is also many tools available online for free that you can use to find where your website fails and where it succeeds. Today however, we are going to discuss the base of everything. The environment of where your website is on, we’re referring to the server and stack. Server is like a PC, that runs bunch of programs to display your website and it is also a place where your website files are located / available. Stack on the other hand is the programs used for load your website, load the needed scripts and render images as well as code.  Recently, a few companies have jumped on the wagon to offer Managed WordPress Hosting. A service where you can host your WordPress website and completely (or so […]

The post Nginx + Varnish + HHVM + WordPress = WP Super Fast appeared first on Kenton Web Design Studio.

]]>
Every client we’ve worked for so far, wants their website to load super fast. No surprise and it’s no secret that Google penalizes your Google search result listing based on your website performance. If your website is loading over 3 to 4 seconds or more, you’ll be back in the line on Google’s list. There’s many aspects that you can look at to improve the speed and page rating of your website, there is also many tools available online for free that you can use to find where your website fails and where it succeeds. Today however, we are going to discuss the base of everything. The environment of where your website is on, we’re referring to the server and stack. Server is like a PC, that runs bunch of programs to display your website and it is also a place where your website files are located / available. Stack on the other hand is the programs used for load your website, load the needed scripts and render images as well as code. 

Recently, a few companies have jumped on the wagon to offer Managed WordPress Hosting. A service where you can host your WordPress website and completely (or so they say) forget about doing anything technical related. Even updates for plugins and WordPress code are taken care of automatically for you. The only thing you are in charge are content. Now each company offering Managed WordPress Hosting has their bragging rights for how fast their client websites load, how good their configurations are, and so on.

I’m here to show, as well provide proof that one tested setup our technical staff did which offers superb WordPress performance, which takes a lot into consideration in terms how to configure the stack properly, is using a stack that has Nginx with Varnish, HHVM and then hosting WordPress on the platform. While our managed hosting platform from the beginning was always Nginx + Varnish, we took it to the max and spent about a year tweaking configurations using live beta website scenarios to achieve optimum performance. This includes small websites and large websites. Since we’re in the business of WordPress, hosting and VM reselling, we will be talking about our platform on one single VM.

That said, we took and setup a VM with 512MB of ram. Put Nginx, Varnish and MySQL to it, then setup an FTP server too. Sure, at the visitors we get each month and images we have on our website we are crunching numbers really hard. However, with the new set of configurations and setups, we’ve got our website (www.kentonwebdesign.com) down to 500ms – 700ms total load times. I know, a few people that got it down to 200ms but not a single image on those sites and we’ve got a few. It’s not all about images, you also have to remember the JavaScript, overheads and other things to. 512MB of ram with a single core of 2.4 isn’t much but that is what we had around on another provider and we were determined to get things caching right.

Nginx Varnish WordPress

Comparing our Kenton Web Design website to the overall average at CloudyPress of 1.5 seconds each website gets, we’ve embarked on something really awesome.

The post Nginx + Varnish + HHVM + WordPress = WP Super Fast appeared first on Kenton Web Design Studio.

]]>
https://www.kentonwd.com/nginx-varnish-hhvm-wordpress-wp-super-fast/feed/ 0
WordPress Previous and Next post links not working? https://www.kentonwd.com/wordpress-previous-and-next-post-links-not-working/ https://www.kentonwd.com/wordpress-previous-and-next-post-links-not-working/#respond Mon, 05 Mar 2012 15:13:25 +0000 https://www.kentonwd.com/?p=15926 Working on a few hundred WordPress projects within about 13 years, you come across a few things that you can explain why they just don’t work and right away you notice the culprit issue which in most cases some developer just seem to forget about. In this article we are going to take a quick look at WordPress function for displaying Previous and Next links on your post indexing pages or article listing pages. If properly implemented everything should work out of the box. However, we noticed that a lot of times the out-of-the-box is not working for two main reasons. Reason one, is that previous development of your theme is done incorrectly, leaving WordPress query loops and open php code just opened. Reason two, your loop is missing an extra string that allows this out of the box function to work or WordPress to recognize that we moved on from page one to page two, three and so on. In other words, the effect we get is that our WordPress article list page is showing same posts on page 1, page 2 and even page 10, when it should be showing us 10 different articles on page 1, and […]

The post WordPress Previous and Next post links not working? appeared first on Kenton Web Design Studio.

]]>
Working on a few hundred WordPress projects within about 13 years, you come across a few things that you can explain why they just don’t work and right away you notice the culprit issue which in most cases some developer just seem to forget about.

In this article we are going to take a quick look at WordPress function for displaying Previous and Next links on your post indexing pages or article listing pages. If properly implemented everything should work out of the box. However, we noticed that a lot of times the out-of-the-box is not working for two main reasons. Reason one, is that previous development of your theme is done incorrectly, leaving WordPress query loops and open php code just opened. Reason two, your loop is missing an extra string that allows this out of the box function to work or WordPress to recognize that we moved on from page one to page two, three and so on. In other words, the effect we get is that our WordPress article list page is showing same posts on page 1, page 2 and even page 10, when it should be showing us 10 different articles on page 1, and 10 different articles on page 2, and so on.

So let’s take a quick look at what possibly might be the solution to the problem, if one exists.

THE PROBLEM!

Number one problem, our previous and next links work but either don’t show posts at all or show same posts no matter what page you are on. The problem we’ve found in WordPress template building with previous and next post links is that when you add the code tag <?php next_posts_link(”) ?> or <?php previous_posts_link(”) ?> to your index.php page or any page-.php file, is that it still will work creating the link and paginate, but no matter which page you are on (https://www.domain.com/page/2 or https://www.domain.com/page/10) it is still showing you the same exact articles. No matter which page you last, if you have setup for WordPress to query and display 10 articles per page, each and every pagination (1, 2, 3, or even 20) will still show that same exact 10 articles.

SIMPLE FIX

Our fix is very simple. It’s one of those things that for some reason many developers over look. In most cases, its a learning curve for the very new at WordPress. What most are forgetting, is to let the post loop in WordPress know which page we are at. Think of it this way, till now, since you’re having the issue, WordPress processing and listing your posts as articles only thought you’ve been on page 1 with 10 articles on it. That’s all it thought you were doing, even if you were on page 10. So let’s help it, learn what page we are truly on. To do that, you have to locate the following like which sits some where near the index.php file.

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

Now let’s go and change that just a big. Remember, we’re just letting WordPress index.php file know, that when we click on previous or next link, we’re switching pages thus new articles next in line should show. So the correct line should go something like this;

<?php query_posts( $query_string . '&pagename=&page_id=' ); if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

That’s it! The above “query_posts( $query_string . ‘&pagename=&page_id=’);” entry line fixes our issue where next and previous post links stopped working.

CONCLUSION

Now that wasn’t so hard was it? If you still can’t get it working, even with the suggest line above then there might be something even deeper going on wrong with your theme. Don’t hesitate to contact us directly, as we are always happy to help fixing WordPress issues or contact your theme developer.

The post WordPress Previous and Next post links not working? appeared first on Kenton Web Design Studio.

]]>
https://www.kentonwd.com/wordpress-previous-and-next-post-links-not-working/feed/ 0