Skip to content

Category: Wordpress

Responsive Web Design

Published by admin on 19 Dec ’16

Responsive web design (RWD) is a design and technical approach that aims to adapt the layout and interaction of a site or app to work optimally across a wide range of device resolutions, screen densities and interaction modes with the same underlying codebase.

RWD basics

RWD has three key elements:

  • CSS media queries, used to target styles to specific device characteristics such as screen width breakpoint or resolution.
  • A fluid grid, that specifies elements and widgets in flexible units with the goal of making them flow to fill their containers.
  • Flexible images and media, are also sized in relative units so they re-size to fit within their containers.

By creating all screen elements to be fluid and flexible, it allows the media queries to focus primarily on controlling layout rules for containers; the modules inside simply re-size to fit their containers.

A simple responsive example may be two stacked containers, each with flexible content or widgets inside. At greater widths, media queries are used to float both containers to create a two column layout to take better advantage of the wider screen.

Since the content inside each container is designed to re-flow to fit its parent, the media queries can focus just on the rules for making the columns stack or float, and to override or add styles only needed at greater widths.

—

Order your responsive web design now from KAV Design at info@kavdesign.net or just call us at +359 898 884431

Minimal Portfolio WordPress Theme

Published by admin on 29 Apr ’16

minimal-portfolio-wordpress-theme-preview-590-300

Featuring the new theme by us called Minimal Portfolio. It’s nice and responsive.

See DEMO of Minimal Portfolio WordPress Theme

Features:

  • Fully responsive (mobile ready);
  • Fast – no additional frameworks and plugins used in this demo;
  • Clean quality code;
  • Social media icons included in the theme;
  • Multi-browser support – tested on most browsers out there;
  • Logo uploader in the theme customizer (if no logo is uploaded you site title from the general settings will be used like in this demo);
  • Documentation, installation and usage instructions in the theme readme.txt file;
  • Easy to customize – if you are a developer you will find it very easy to customize;
  • Submenu items support included in the theme;
  • HTML5 & CSS3 ready.

Email us if you want this theme for free.

How to Add Social Sharing Buttons to a List of WordPress Posts on an Index Page or category page with No Plugins

Published by admin on 13 Oct ’12

Facebook Like Buttons for WordPress Loops

  1. Go to the official Facebook page for creating buttons.
  2. For the URL to Like field, just enter in your website’s main URL for now, something like http://yourwebsite.com. You can set any of the other settings as you’d like.
  3. Click Get the Code and choose IFRAME as the type of code you want to use.
  4. Copy and paste the providing code into your theme where you want the button to appear.
  5. Before saving, look through the code for the text “http://%3A%2F%2Fyourwebsite.com”, as highlighted in the example below:
    <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fyourwebsite.com&send=false&layout=standard&width=450&show_faces=true&action=like&colorscheme=light&font&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
  6. Replace that entire highlighted section with <?php the_permalink(); ?>

And tooty fruity oh rudy you’re all set for Facebook. What we did there was used WordPress’ the_permalink() function to set the URL instead of the one Facebook asks us to manually enter.

 

Full article:

http://clicknathan.com/web-design/how-to-add-social-sharing-buttons-to-a-list-of-wordpress-posts-on-an-index-page-with-no-plugins/

 

Create a simple ticker in this case showing latest tweets in WordPress

Published by admin on 24 Apr ’12

First lets install some plugin to show the latest tweets in wordpress. The plugin that I used is this one: http://wordpress.org/extend/plugins/twitter-for-wordpress/

You can use any plugin.

Install and put the widget in some position.

Here is an example of the output needed for the jQuery to work correctly:

<div>
    <p>A tweet is here</p>
    <p>Another tweet here</p>
    <!-- cont... -->
</div>
Continue readingCreate a simple ticker in this case showing latest tweets in WordPress