Make jQuery work on the same page with Mootools and or Prototype

Tue, 06/24/2008 - 22:23 — Mike

Some conflicts appear when using jQuery javascript library with Motools or Prototype on the same page. A workaround is using noConflict mode for jQuery.

Follow this steps:

1. Download the latest version of jQuery

2. Download jQuery compat

3. Open jquery.js, go to the end of the file and add this line jQuery.noConflict();

4. With jquery.js opened, open jquery.compat-1.0.js copy all it's content and paste-it after jQuery.noConflict(); line in jquery.js.

5. Find this lines and comment or delete them them:

jQuery.fn._filter = jQuery.fn.filter;
jQuery.fn.filter = function(arr){
  return this._filter( arr.constructor == Array ? arr.join(",") : arr );
};

6. Open all .js files that use jQuery library and add as the first line (function($){ and as the last line })(jQuery);

(function($){
content of the .js file
})(jQuery);

That's it.

CSS hack for Safari

Sun, 06/08/2008 - 16:28 — Mike

Generally Safari browser print a website layout the way i want. Some times thou, it won't do it as Firefox do.

This is an example hack for Safari. The css class inside @media screen and (-webkit-min-device-pixel-ratio:0){} will be read only by Safari. So, in Firefox the object that user this class will have a padding-left of 10px and in Safari i canceled the 10px padding by defining a new value (padding-left: 0px;)

.class {
width: 100px;
padding-left: 10px;
}
 
@media screen and (-webkit-min-device-pixel-ratio:0){
.class {
width: 100px;
padding-left: 0px;
}}

Add a linkedin field to vbulletin user profile

Tue, 05/13/2008 - 14:11 — Mike

A few days ago i added a new option to the user profiles in a vbulletin forum ( http://www.seo-romania.com/forum ). This option let the users have on their postbit a link to their http://linkedin.com profile.

See the link to the linkedin profile below the user info in the following image or go directly to the forums http://www.seo-romania.com/forum/showthread.php?t=304 .

It's simple to achieve this, just follow the next steps:

1. Go to admincp -> User Profile Fields -> Add New User Profile Field
Select a "Single-Line Text Box" from the dropdown menu, press continue and in the next page just enter something on the "Title" field.
Save. After you are done with this, write somewhere the field id (field6 in my case)

Mine looks something like this.

and on the user profile page looks like this (i've added a "how to use" for users):

2. Go to this link http://www.linkedin.com/profile?promoteProfile=&trk=mypro_badges (you must be logged in tho see the page), select a button you like and copy the code from the right side.

Go back to you vbulletin admin panel -> Styles & Templates -> Styles & Templates and select "Edit Templates" on the theme you like to have this feature on. From the style templates list, double click on "Postbit Templates".

Joomla 1.5 - add a new module position inside an article

Sun, 05/11/2008 - 16:31 — Mike

Today i received a request to insert a new module position inside the article template of a joomla website. The client wanted to print an adsense module in that position. You can see the result in the image below.

To do this, you need to define a new position first, so go to /templates/your_template. Open the templateDetails.xml file and search for <positions> Add a new position, something like <position>adsense_in_content</position>.
Save the file, and upload it back to it's place.

Server admin stuff

Sat, 05/03/2008 - 11:46 — Mike

Server reboot commands:

  • shutdown -r now - Reboot ("safe" - runs the init scripts associated with the shutdown process)
  • shutdown -nr now - Reboot ("forced" - skips the init scripts - use of this command option is not recommended, as it may affect database integrity and cause other errors)
  • shutdown -h now - Halt the VPS (equivalent to a "safe" shut down)

Logs (cPanel/WHM):

  • /usr/local/apache/logs/error_log - General Apache error log.
  • /usr/local/apache/logs/suexec_log
  • /usr/local/apache/domlogs/domain.com - General access log for each domain.
  • /var/log/messages - FTP log
  • /var/lib/mysql/domain.err - MySQL error log

Other stuff:

  • /var/lib/mysql/account_name/ - MySQL database files location for each account

Drupal - Jcarousel and views

Mon, 03/24/2008 - 02:14 — Mike

Adding a Jcarousel effect to a <ul> of a block view.

Install jquery_update module.
Download Jcarousel. Unzip to theme folder.

Create a block view, than publish it.

Add this snippet inside the <head> part of page.tpl.php:

   <script type="text/javascript" src="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.pack.js"></script>
    <link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.css" />
    <link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/skins/tango/skin.css" />
    <script type="text/javascript">
jQuery(document).ready(function() {
$("div.view-class-name").find("ul").attr("id","jcarousel");
$("#jcarousel").addClass("jcarousel-skin-tango");
$("#jcarousel").jcarousel({
vertical: true,
scroll: 1
});
});
    </script>

List of options you may set

Via drupal.org forums. Posted here for reference.

Drupal - Hide a block for a specific node type

Sun, 03/16/2008 - 01:20 — Mike

I needed to hide a block for a certain node type on a drupal driven website so i found this snippet on drupal.org. I will post it here for my future needs.

Paste this in "Page specific visibility settings" tab on the block you want to hide. Select "Show if the following PHP code returns TRUE (PHP-mode, experts only)." first.

<?php
$match = TRUE;
$types = array('story' => 1);
if (arg(0) == 'node' && is_numeric(arg(1))) {
  $nid = arg(1);
  $node = node_load(array('nid' => $nid));
  $type = $node->type;
  if (isset($types[$type])) {
    $match = FALSE;
  }
}
return $match;
?>

Hide table border in Firefox

Fri, 03/14/2008 - 03:17 — Mike

I have made abuse of tables on one recent project and the problem that toke me some time to figure it out was how to hide the top table border that still appeared in Firefox even that the table had border="0" attribute or border: 0; in CSS.

Anyway, to solve this problem i added this line in the css file:

table {
border-collapse: separate;
}

This is a reminder to myself.. so i won't waste time next time searching for clues on how to handle table borders in Firefox.

Style a search form with CSS

Fri, 03/07/2008 - 15:22 — Mike

Ok, so i have to add some more focus on the search form on a Simple Machine Forum search form. The users seems not to take into account this option, so as a result a lot of duplicate topics appear daily.

This is how the search form looks right now (it's the default theme with some colors changed).

I want it to be wider as the forum is and with some style applied on it.

First, i will remove the lines (from 298 to 302) regarding the news field, which i will not use from the Themes/default/index.template.php : 

	if (!empty($settings['enable_news']))
		echo '
				<td width="90%" class="titlebg2">
					<span class="smalltext"><b>', $txt[102], '</b>: ', $context['random_news_line'], '</span>
				</td>';

than add to the first td line which include the search form a colspan="2" attribute so it will become

Syndicate content