El Micox Codes

Facebook Comments - Simple and not duplicating on all posts

How to insert Facebook comments in blogger without complication, not duplicating. Easy and simple.

1) Model > Edit HTML > Go > Expand Widget Models

2) Search </head> , and open body tag

3) Paste after open <body> before other tags:

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/pt_BR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

4) In any place of your code, where you want comments block write:

<div class="fb-comments" data-href="data:post.url" data-num-posts="10" data-width="470"></div>

5) If this way dont word, try this:

<div class="fb-comments" expr:data-href="data:post.url" data-num-posts="10" data-width="470"></div>

Just this.

If this tip works to you comment or share in social networks.

ERR_CONTENT_DECODING_FAILED in Google Chrome

I've a problem with Google Chrome Navigator in my site www.tadarank.com and www.ofertamagica.com.br

Chrome don't show the page, but this error:

Error 330 (net::ERR_CONTENT_DECODING_FAILED)

Looking this problem on Google, i've found many solutions (including reinstall Chrome).

The solution that works for me was relationed with Zip compression on website.

I made some tests and solved my problem changing headers.

In PHP, i change the header:

header('Content-Encoding: gzip, deflate');

header('Content-Encoding: zlib, deflate, gzip');

No more psroblems with Google Chrome / ERR_CONTENT_DECODING_FAILED. I hope that this solution work to you too.

Sorry my poor "engrish".

Get google (yahoo, bing) search by Javascript

If somebody need:

A small function to Get google (yahoo, bing) search's by Javascript.

keyword = function(){
 var dr=d.referrer,q,fq,goo='';
 if(dr.match(/ogle\.c|ahoo\.c|bing.c/i)){
  if((q=dr.indexOf('q='))>0){
   fq = dr.indexOf('&',q);
   goo = dr.substring(q+2,(fq>q?fq:dr.length));
  }
 }
 return goo;
}

To use, just call "keyword":

var palavrachave = keyword();
if(palavrachave){
  alert("Hi, welcome to my website. You are searching " + palavrachave);
}

Bye.

Ultimate Micox Menu drop-down CSS - 4 levels

Hi, now a code to be easy make your css drop down menu.

Long time ago i'm finding a perfetc css menu drop down code.
I want a dropdown css menu easy to copy/paste, fast and no difficult configurations.
Just set width, color, bg and ready. Working in FF, IE6/7 an Opera.

Yesterday i post the final part that my code need (activating hover in IE6).
See the online example (and source code) of Ultimate Micox Menu Drop Down CSS - 4 levels.

The codes:
First, make your old UL e LI menu.

<ul>
 <li>class='menu-hv'</li>
 <li><a href='#'>2</a></li>
 <li><a href='#'>3...</a>
  <ul style='background-color: red; '>
   <li>31</li>
   <li><a href='#'>32</a></li>
   <li>33</li>
  </ul>
 </li>
 <li><a href='#'>4...</a>
  <ul>
   <li>41</li>
   <li><a href='#'>42</a></li>
   <li><a href='#'>43...</a>
    <ul  style='background-color: blue'>
     <li>431</li>
     <li><a href='#'>432...</a>
      <ul  style='background-color: gray'>
       <li>4321</li>
       <li><a href='#'>4322</a></li>
      </ul>
     </li>
    </ul>
   </li>
   <li>44</li>
  </ul>
 </li>
</ul>

Second, put the class 'menu-hv' in your UL (or in parent div of UL) to activate horizontal-vertical menu. To vertical-vertical menu the class name is 'menu-vv'.

<ul class='menu-hv'>

Finally, put the code of Ultimate Micox Menu drop-down CSS (UMMDDCSS heheheh) in your CSS code or file. You can edit font, color, width, etc of menu itens in indicated place of my code.

/*
  Menus drop-down horizontal-vertical (hv) e vertical-vertical (vv) 4 levels
  by Micox - elmicoxcodes.blogspot.com - Ver. 2.0 - 20/02/08 - Creative Commons License
*/    
.menu-hv, .menu-vv { position: relative; margin: 0; padding: 0; display: block; zoom: 1;}
 .menu-hv * ,    .menu-vv * { margin: 0; padding: 0 ; list-style: none}
 .menu-hv li ,   .menu-vv li { position: relative; line-height: 1.2em; vertical-align: top }
 .menu-hv a ,    .menu-vv a { display: block; zoom: 1; line-height: 1.2em }
 .menu-hv li ul, .menu-vv li ul { position: absolute; visibility: hidden  }
 .menu-hv li:hover ul,  .menu-vv li:hover ul,
 .menu-hv li.hover ul,  .menu-vv li.hover ul { visibility: visible }
 .menu-hv li:hover ul ul,  .menu-vv li:hover ul ul,
 .menu-hv li.hover ul ul,  .menu-vv li.hover ul ul { visibility: hidden }
 .menu-hv li li:hover ul,  .menu-vv li li:hover ul,
 .menu-hv li li.hover ul,  .menu-vv li li.hover ul { visibility: visible }
 .menu-hv li li:hover ul ul,  .menu-vv li li:hover ul ul,
 .menu-hv li li.hover ul ul,  .menu-vv li li.hover ul ul { visibility: hidden }
 .menu-hv li li li:hover ul,  .menu-vv li li li:hover ul,
 .menu-hv li li li.hover ul,  .menu-vv li li li.hover ul { visibility: visible }
 /* horizontal-vertical */
 .menu-hv:after, .menu-hv.after { content: "."; line-height: 0px; clear: both; display: block; visibility: hidden}
 .menu-hv li { float: left; }  
 .menu-hv li ul li { float: none; }
 .menu-hv li ul li ul { position: absolute; left: 100%; top: 0; }
 /* vertical-vertical */
 .menu-vv { float: left; } 
 .menu-vv li ul { left: 100%; top: 0; }
 /* ****************************************
   Define width, color, bg, etc ABOVE or clear this line if will define in other place
 */
 .menu-hv li { width: 100px; background-color: yellow }
 .menu-vv li { width: 100px; background-color: yellow }
 .menu-hv li a:hover { background-color: cyan }
 .menu-vv li a:hover { background-color: cyan }

 
/* Micox Pseudo-class-css2 to IE (MXPC). Activate .hover and .first-child in IE 6
   http://elmicox.blogspot.com/2008/03/ativando-hover-e-first-child-no-ie-6-um.html */
* html * { color: expression( (function(who){ if(!who.MXPC){
 who.MXPC = '1';
 if(who.nodeName != 'A'){
  who.onmouseenter=function(){ who.className += ' hover'};
  who.onmouseleave=function(){ who.className = who.className.replace(' hover','')}; }
 (who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }

Ready! Comments please.

New way to hover and first-child in IE6

Hi, i'm back

Now, i show a new way to simulate pseudo-class first-child and hover in IE6 with a diferent method. No HTC, no tag script, no external file.

The advantage of my new code is that can be inserted directly in CSS and not needs another file. The idea of "expression" can be used to other implementations :).

Micox Pseudo-class-css2 to IE (MXPC)

/* Micox Pseudo-class-css2 to IE (MXPC). Activate .hover and .first-child in IE 6 */
* html * { color: expression( (function(who){ if(!who.MXPC){
 who.MXPC = '1';
 if(who.nodeName != 'A'){
  who.onmouseenter=function(){ who.className += ' hover'};
  who.onmouseleave=function(){ who.className = who.className.replace(' hover','')}; }
 (who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }

/* example */
p:first-child , p.first-child { color: red }
li:hover a , li.hover a { background-color: blue }

How to use? Just put on top of your css code and use classes .hover and .first-child with the :hover and :first-child. See a online EXAMPLE page and code source.

p:hover , p.hover { color: red }

Comments please.