Rounded Corners wiki

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
You are viewing a wiki page. You are welcome to join the group and then edit it. Be bold!

Installation

Installation instructions for rounded_corners http://drupal.org/project/rounded_corners

  1. Download rounded_corners from http://drupal.org/project/rounded_corners
    and extract the contents into your modules folder.
  2. [5.x only] Download jquery.corner.js from http://github.com/malsup/corner/raw/master/jquery.corner.js
    and place it inside your rounded_corners folder.
  3. [5.x only] Check administer > Site Configuration > Rounded corners to see if jquery.corner.js
    is correctly installed.
  4. [5.x optional, 6.x required] After enabling the module, you will need to add some code to the THEME_preprocess() function located in your theme's template.php file. If you know what you are doing, you can put the code in other places too. See the section titled Adding To A Theme below.

JC:RC configuration

[5.x Only, for 6.x instructions, see section Adding To A Theme]
in admin/settings/rounded_corners you need to add jquery statements telling the plugin where to apply corners, and the type and radius of the corner to be applied. More documentation about selectors can be found at jquery.org, and more advanced corner implementation can be found at: http://www.malsup.com/jquery/corner/

Declarations should be added one per line, and are roughly in the form of
$("#id").corner("corner-type position pixel radius");

or
$(".class").corner("corner-type position pixel radius");

to apply corners to an ID or class respectively.

These examples assume you want rounded corners on your blocks, and that your theme generates blocks with markup similar to this:

<div class="block">
</div>

To apply round corners with a 10px radius to all corners of all blocks, you would use:
$(".block").corner("round 10px");

To apply round corners to only the top of blocks:
$(".block").corner("round top 10px");

Round corners on top, and bevelled on bottom:
$(".block").corner("round top 10px");
$(".block").corner("bevel bottom 10px");

To apply round corners to only blocks in your right sidebar.
$("#sidebar-right .block").corner("round top 10px");

Adding to a Theme

The example above can be added to your theme by editing the theme's template.php and adding to the THEME_preprocess():

$commands = array();
$commands[] = array('selector' => '#sidebar-right .block', 'effect' => 'round', 'corners' => 'top', 'width' => 10);
rounded_corners_add_corners($commands);

Below you will find a code snippet from an example template.php file (if anyone with a lot of PHP experience would like to make suggestions on how to make the code better, please let us know here or send me a message. -loopDuplicate) You will need to replace [your_theme_name] with your theme's name.
See http://www.malsup.com/jquery/corner/ for various other style examples and don't forget to read the README.txt file included in the module download.

function [your_theme_name]_preprocess() {
// if rounded corners module is installed and enabled, round corners on certain elements using jquery
// else do nothing
 if (function_exists('rounded_corners_add_corners')){
  $btmround = array();
  $btmround[] = array('selector' => '.btmround');
  rounded_corners_add_corners($btmround);
  $divnormal = array();
  $divnormal[] = array('selector' => '.divnormal');
  rounded_corners_add_corners($divnormal);
  $divnormaldark = array();
  $divnormaldark[] = array('selector' => '.divnormaldark');
  rounded_corners_add_corners($divnormaldark);
  $btrround = array();
  $btrround[] = array('selector' => '.btrround');
  rounded_corners_add_corners($btrround);
  $btrround4 = array();
  $btrround4[] = array('selector' => '.btrround4', 'width' => 4);
  rounded_corners_add_corners($btrround4);
  $blockmenuleaf = array();
  $blockmenuleaf[] = array('selector' => '#block-menu-menu-footernav li.leaf', 'width' => 5);
  rounded_corners_add_corners($blockmenuleaf);
  $blockimagemenu1 = array();
  $blockimagemenu1[] = array('selector' => '#block-imagemenu-1');
  rounded_corners_add_corners($blockimagemenu1);
 }
 else {
 return;
 }
}

Rounded Corners

Group organizers

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds:

Hot content this week