Implementar Código en Wordpress para Crear Índice de Categorías y Posts

  • Autor Autor Allan Cano
  • Fecha de inicio Fecha de inicio
Allan Cano

Allan Cano

Iota
Verificación en dos pasos activada
Hola amigos,

Quisiera pedirles ayuda para implementar el código de abajo en un blog en wordpress (sí es que es posible), el código se pega en una página de blogger y crea un indice de todo el blog por categorías - posts. En esta pagina se puede ver funcionando: indice ~ AMOR SEVILLISTA


Insertar CODE, HTML o PHP:
<style type="text/css">
#tabbed-toc {
margin:0 auto;
background-color:#252524; /*color fondo etiquetas*/
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);
box-shadow:0 1px 3px rgba(0,0,0,.4);
overflow:hidden;
position:relative;}
#tabbed-toc .loading {
display:block;
padding:5px 10px;
font:normal bold 10px Arial,Sans-Serif;
color:white;}
#tabbed-toc ul,
#tabbed-toc ol,
#tabbed-toc li {
margin:0 0;
padding:0 0;
list-style:none;}
#tabbed-toc .toc-tabs {
width:15%;
float:left;}
#tabbed-toc .toc-tabs li a {
display:block;
font:normal bold 10px/28px Arial,Sans-Serif;
height:28px;
overflow:hidden;
text-overflow:ellipsis;
color:#ccc; /* color enlace etiqueta */
text-transform:uppercase;
text-decoration:none;
padding:0 12px;
cursor:pointer;}
#tabbed-toc .toc-tabs li a:hover {
background-color:#4B4B4B; /* background de etiquetas */
color:white;} /* color enlace etiqueta con background */
#tabbed-toc .toc-tabs li a.active-tab {
background-color:#ccc; /* background de la primera etiqueta */
color:white; /* color enlace primera etiqueta con background */
-webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
-moz-box-shadow:-2px 2px 2px rgba(0,0,0,.5);
box-shadow:-2px 2px 2px rgba(0,0,0,.5);
position:relative;
z-index:5;
margin:0 -1px 0 0;}
#tabbed-toc .toc-content,
#tabbed-toc .divider-layer {
width:85%;
float:right;
background-color:#ffffff; /* color separación entre entradas */
border-left:5px solid #ccc; /* borde separación entre etiquetas y entradas */
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;}
#tabbed-toc .divider-layer {
float:none;
display:block;
position:absolute;
top:0;
right:0;
bottom:0;
-webkit-box-shadow:0 0 7px rgba(0,0,0,.7);
-moz-box-shadow:0 0 7px rgba(0,0,0,.7);
box-shadow:0 0 7px rgba(0,0,0,.7);}
#tabbed-toc .panel {
position:relative;
z-index:5;
font:normal normal 10px Arial,Sans-Serif;}
#tabbed-toc .panel li a {
display:block;
position:relative;
font-weight:bold;
font-size:11px;
color:#3A3A3A; /* color enlace de entradas */
line-height:20px;
height:20px;
padding:0 12px;
text-decoration:none;
outline:none;
overflow:hidden;}
#tabbed-toc .panel li:nth-child(even) {
background-color:#DFDDDD;} /* primer color separación entre entradas */
#tabbed-toc .panel li:nth-child(even) {
}
#tabbed-toc .panel li a:hover,
#tabbed-toc .panel li a:focus,
#tabbed-toc .panel li.bold a {
background-color:#333; /* color background de las entradas */
color:white; /* color del enlace con el background de las entradas */
outline:none;}
   [MENTION=16931]medi[/MENTION]a (max-width:700px) {
#tabbed-toc .toc-tabs,
#tabbed-toc .toc-content {
overflow:hidden;
width:auto;
float:none;
display:block;}
#tabbed-toc .toc-tabs li {
display:inline;
float:left;}
#tabbed-toc .toc-content {
border:none;}
#tabbed-toc .divider-layer,
#tabbed-toc .panel li time {
display:none;}}
</style>
<div id="tabbed-toc"><span class="loading">Loading...</span></div>
<a style="display:block;text-align:right;font:normal bold 8px Arial,Sans-Serif;text-decoration:none;margin:10px;" href="http://www.amorsevillista.com/" title="indice">Amor Sevillista</a>
<script type="text/javascript">
var tabbedTOC = {
blogUrl: "http://amorsevillista.blogspot.com", /* url de tu blog */
containerId: "tabbed-toc", 
activeTab: 1,//()
showDates:false, 
numChars: 200, 
newTabLink: true,
maxResults: 99999, 
preload: 0, 
sortAlphabetically: true,
showNew: 5,
newText: " - <em style='color:red;'>Nuevo!</em>" 
};
</script>
<script src='https://dl.dropboxusercontent.com/u/54259066/indice.js
' type='text/javascript'></script>

Cualquier respuestas es más que bienvenida y estoy de que me ayudará mucho.

Saludos y gracias de antemano.
 
Atrás
Arriba