Jump to content
  • Sky
  • Blueberry
  • Slate
  • Blackcurrant
  • Watermelon
  • Strawberry
  • Orange
  • Banana
  • Apple
  • Emerald
  • Chocolate
  • Charcoal
Miguel92

Actualización: Compartir posts "Redes Sociales"

Recommended Posts

Actualización:

Compartir posts "Redes Sociales"

 

Bueno cuando ves un post, lo más probable que lo veas de esta manera...

Y un mensaje en la consola que dice lo siguiente 'imagen'

88E.png

 

Bien empecemos:

1 - Buscamos en templates/modules/m.posts_content.tpl (o en donde tengas para compartir ya que los themes son distintos)

 

CAMBIAMOS TWITTER

<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="{$tsConfig.titulo}" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

la reemplazamos por

<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-size="large" data-text="{$tsPost.post_title}" data-url="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" data-lang="es" data-dnt="true" data-show-count="true">Tweet</a>

 

CAMBIAMOS FACEBOOK

<a name="fb_share" share_url="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" type="box_count" href="http://www.facebook.com/sharer.php">Compartir</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>

la reemplazamos por

<div class="fb-share-button" data-href="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" data-layout="button_count" data-size="large" data-mobile-iframe="true"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html&src=sdkpreparse" class="fb-xfbml-parse-ignore">Compartir</a></div>

 

2 - Como verán no posee los *.js para que funcione yo lo he colocado a mi manera, ustedes lo pueden poner en el mismo archivo o hacer lo que hice, en templates/t.posts.tpl arriba de

{include file='sections/main_footer.tpl'}

agregan esto

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<div id="fb-root"></div>
{literal}
<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 = "https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v3.0";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
{/literal}

 

EE3.png

 

Ahora si quieren agregar Google+

1 - En m.posts_content.tpl debajo de

<ul class="post-compartir clearbeta">

agregan esto

<li class="share-big">
      <div class="g-plus" data-action="share" data-height="24" data-href="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html"></div>
</li>

2 - Ahora en t.posts.tpl arriba de

{include file='sections/main_footer.tpl'}

agregan esto
 

<script src="https://apis.google.com/js/platform.js" async defer>{literal}{lang: 'es'}{/literal}</script>

y les quedaría así...

(imagen actualizada)

64B.png

 

Nota: Para visualizarlo de esta manera buscar en el mismo archivo en el que sea realizado la modificación "m.posts_content.tpl" y buscamos (solo en la de twitter, facebook y google) solo los 3 primero (en el caso que no agregues google serán los 2 primeros)

<li class="share-big">

y la cambian por

<li class="share-big" id="redes">

luego ir a estilo.css y buscan

.FBConnectButton_Small .FBConnectButton_Text {
    margin-left:17px;
    padding:2px 4px 3px!important;
    -moz-border-radius:3px;
}

y arriba pegan esto

.post-compartir #redes {
    margin-top: 32px;
}

 

Editado por Miguel92
Topic: Actualizado....

Compartir este post


Enlace al post
Compartir en otros sitios

ei pero mis botonos se ven arriba komo hago para ke se vean abajo 

buen mod jaja salu2

Compartir este post


Enlace al post
Compartir en otros sitios

  • Similar Content

    • Por Miguel92
      En este caso es cómo integrar redes sociales a nuestra web!
       
      Les dejaré el archivo adaptado a la versión de font awesome 5, el zip contiene (la descomprimen dentro de default):
      DESCARGAR: jssocial.zip
      CSS/jssocials:
      * js-socials.min.css
      * jsSocials-flat.min.css
      * jsSocials-classic.min.css
      * jsSocials-minima.min.css
      * jsSocials-plain.min.css
       
      JS/jssocials:
      * jssocials.min.js
      * configuracion.js [Solo la configuración básica]
       
      CDN:
      * https://use.fontawesome.com/releases/v5.2.0/css/all.css
       
      [01] Abrimos main_header.tpl en default/templates/sections y debajo de wysibb.css pegamos esto:
      <link href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" rel="stylesheet">  
      [02] Abrimos t.posts.tpl en default/templates y debajo de
      {include file='sections/main_header.tpl'}
      pegaremos lo siguiente
      <link rel="stylesheet" href="{$tsConfig.css}/jssocials/js-socials.min.css"> <link rel="stylesheet" href="{$tsConfig.css}/jssocials/jsSocials-flat.min.css"> en el mismo archivo arriba de
      {include file='sections/main_footer.tpl'}
      pegaremos esto
      <script src="{$tsConfig.js}/jssocials/jssocials.min.js"></script>         <script src="{$tsConfig.js}/jssocials/configuracion.js"></script>  
      [03] Luego abriremos m.posts_content.tpl en templates/modules y buscamos
                                      <ul class="post-compartir clearbeta">                                                                          <li class="share-big">                                                                                  <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="{$tsConfig.titulo}" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>                                                                          </li>                                                                          <li class="share-big">                                                                                   <a name="fb_share" share_url="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" type="box_count" href="http://www.facebook.com/sharer.php">Compartir</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>                                                                          </li>                                                                          <li class="share-big">                                                                                   <span class="share-t-count">{$tsPost.post_shared}</span>                                                                                  <a href="{if !$tsUser->is_member}javascript:registro_load_form(); return false{else}javascript:notifica.sharePost({$tsPost.post_id}){/if}" class="share-t"></a>                                                                          </li>                                                                          <li class="txt-movi">Compartir en:</li>                                                                  </ul>
      y la reemplazaremos por
                                      <div id="Compartiendo"></div> Bueno allí tienen la configuración terminada esto solo es la básica!

      En el video mostraré como hacer más configuraciones para que quede mejor...
       
      VER VIDEO TUTORIAL + AVANZADA
    • Por Miguel92
      Tema orginal "Cralke"
      Jquery 1.7.1
      Captcha v1
       
      Tema actualizado "Cralke"
      Jquery 3.3.1
      Recaptcha v2
       
      Actualizador automático + instalación del theme, solo te queda borrar el cache!
      (lo que quiero decir que no tienes que ir a administración -> temas -> e instalarlo desde allí, el upgrade ya lo instala y lo activa)
       
      PANTALLA DEL REGISTRO

       
      PANTALLA DEL UPGRADE (1)

       
      Seleccionan "Realizarlas automáticamente" y luego presionan realizar instalación
       
      PANTALLA DEL UPGRADE (2)

       
      Si esta en verde, quiere decir que ya las ejecuto!
      Si esta en rojo, quiere decir que la línea esta duplicada o hay un error...En el caso de esta esas 2 estan duplicadas...
       
      MODO 1: Crakle(theme+archivos):
      Contiene el theme completo + los 5 archivos del directorio class (c.borradores.php, c.core.php, c.cuenta.php, c.posts.php y c.registro.php)
      Descargar: Crakle(theme+archivos)
       
      MODO 2: Crakle(completo):
      Contiene el theme completo + directorio inc completo(versión 1.3)
      Descargar: Crakle(completo)
       
      La descomprimen dentro de la carpeta raíz, luego en el navegador web lo usan así https://www.tu_web.com/upgrade/
       
      PASO OLVIDADO:
      Buscar en templates/modules/admin_mods/m.admin_rangos.tpl y borrar
      {literal} <style> #colores {width:200px; position:absolute; right:50px; padding:15px 8px 10px 10px; border:1px solid #ccc; background-color:#fafafa;} #cerrar {position:absolute; right:5px; top:3px; z-index:2} #colores .title {position:absolute; left:10px; top:0px; z-index:2; font-weight:bold} #colores span {display:block; float:left; cursor:pointer; border:1px solid #FFF; border-width:1px 1px 0 0} /* ADMIN NEW LABEL */ fieldset tr.newLabel td{text-align:left;} fieldset tr.newLabel label{ float:none; width:80px; padding:0; text-align:center; cursor:pointer; } tr.newLabel label.yes:hover { background-color:#86F786; } tr.newLabel label.no:hover { background-color:#EFB0B2; } </style> {/literal}  
      Luego más abajo buscar
      <dd><input type="text" id="rColor" name="rColor" value="{$tsRango.r_color}" style="color:#{$tsRango.r_color}; font-weight:bold;width:30%"/></dd> y reemplazarlo (en realizar al input se le agrega class="jscolor")
      <dd><input type="text" id="rColor" class="jscolor" name="rColor" value="{$tsRango.r_color}" style="color:#{$tsRango.r_color}; font-weight:bold;width:30%"/></dd>  
    • Por Miguel92
      Actualización del Jquery
      Actualizar Jquery 1.7.1 a Jquery 3.3.1
       
      Para ello buscamos en nuestro theme en la carpeta de JS y borraremos jquery.min.js, luego entramos a este archivo Jquery 3.3.1.min.js , y la llamaremos jquery-3.3.1.min.js
       
      Ahora iremos a templates/sections/main_header.tpl y buscamos
      <script src="{$tsConfig.js}/jquery.min.js" type="text/javascript"></script> <!-- Cargamos libreria jQuery desde Google <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> --> y la reemplazamos por
      <script src="{$tsConfig.js}/jquery-3.3.1.min.js" type="text/javascript"></script> o simplemente reemplazamos el contenido del archivo jquery.min.js
       
      luego buscamos 
      <script src="{$tsConfig.js}/jquery.plugins.js" type="text/javascript"></script> <script src="{$tsConfig.js}/acciones.js" type="text/javascript"></script> <script src="{$tsConfig.js}/funciones.js" type="text/javascript"></script>  
      y agregaremos ?{$smarty.now} para evitar borrar la cache una y otra vez, con este método es como que lo registra por primera vez!
      [SOLO SI ACTUALIZARÓN ANTES A SMARTY 3.2]
      <script src="{$tsConfig.js}/jquery.plugins.js?{$smarty.now}" type="text/javascript"></script> <script src="{$tsConfig.js}/acciones.js?{$smarty.now}" type="text/javascript"></script> <script src="{$tsConfig.js}/funciones.js?{$smarty.now}" type="text/javascript"></script>  
      Ahora las modificaciones, su usas Sublime Text 3 o Notepad++, haz una búsqueda y reemplazar (find & replace) ¡OJO! hay que tener mucho cuidado de no reemplazar lo que no debemos cambiar... a lo siguiente que hacemos es: 
       
      "Debo agradecer a @MrDioamDev por explicarme lo necesario"
       
      ============== ACCIONES ==============
      Archivo: acciones.js
      Buscar .live( y reemplazarla por .on(
      Líneas: 1234 (x2 en la misma línea)
      ******
      Ahora buscamos .bind( y la cambiamos por .on( 
      Líneas: 1240, 1262, 1265, 1298
      ******
      despues buscamos .unbind( y la cambiamos por .off(
      Líneas: 1076, 1298 (x2 en la misma línea)
       
      ============== CUENTA ==============
      Archivo: cuenta.js
      Buscar .live( y reemplazarla por .on(
      Línea: 2
      ******
      Ahora buscamos .bind( y la cambiamos por .on( 
      Líneas: 189, 287
      ******
      despues buscamos .unbind( y la cambiamos por .off(
      Líneas: 189, 417, 534 (x2 en la misma línea)
       
      Luego en el mismo archivo línea 449 que debe decir
      "// Jcrop-0.9.8-min - K. Hallman / DeepLiquid.com 08 - http://deepliquid.com/content/Jcrop.html - MIT License"
      borran todo desde allí hasta abajo
       
      ============== CUENTADOS ==============
      Archivo: cuentados.js
      Borrar este archivo
       
      ============== FAVORITOS ==============
      Archivo: favoritos.js
      Ahora buscamos .bind( y la cambiamos por .on( 
      Líneas: 166, 235
      ******
      despues buscamos .unbind( y la cambiamos por .off(
      Líneas: 166, 235
       
      ============== FOTOS ==============
      Archivo: fotos.js
      Ahora buscamos .bind( y la cambiamos por .on( 
      Líneas: 224, 230
       
      ============== FUNCIONES ==============
      Archivo: funciones.js
      Buscar .size(); y reemplazarla por .length;
      Línea: 557
       
      ============== JQUERY.COLOR ==============
      Archivo: jquery.color.js
      Buscar .live( y reemplazarla por .on(
      Línea: 55
       
      ============== JQUERY.FORM ==============
      Archivo: jquery.form.js
      Borrar este archivo, ya que se actualizará en jquery.plugins
       
      ============== JQUERY.PLUGINS ==============
      Archivo: jquery.plugins.js
      En otro topic ya que actualizaremos los plugins dentro del archivo
      abrir el archivo y reemplazar el contenido por jquery.plugins (actualizado)
       
      ============== JQUERY.TABLEDND ==============
      Archivo: jquey.tablednd.js
      Borrar este archivo, ya que se actualizará en jquery.plugins
       
      ============== LIVE ==============
      Archivo: live.js
      Buscar .live( y reemplazarla por .on(
      Línea: 165
       
      ============== PERFIL ==============
      Archivo: perfil.js
      Buscar .live( y reemplazarla por .on(
      Líneas: 578, 592
    • Por Miguel92
      Esto solo y únicamente para los que actualizaron
      de PHP 5.6 a PHP 7.x...
       
      NOTA: En la documentación oficial de php.net es funcional hasta:
      (PHP 4, PHP 5, PHP 7) each — Devolver el par clave/valor actual de un array y avanzar el cursor del array  
      En el archivo templates/b_toup/home/b.tags_recientes.tpl hay una función llamada each() y se visulizará un mensaje parecido a este
      Deprecated: The each() function is deprecated. This message will be suppressed on further calls in [ubicación en cache]....  
      Para arreglar eso buscamos en el archivo ya mencionado esto: [línea 31]
      while (list($name, $valor) = each($tags)){ y la reemplazamos por
      foreach($tags as $name => $valor) {  
    • Por Miguel92
      Theme original: hecho por @DarkMagican
       
      Se actualizó:
      - Theme AdminLTE por DarkMagican
      -- Jquery v1.7.1 a v3.3.1
      -- Bootstra v3.3.4 a v3.3.7 (css | js)
      -- AdminLTE 2.0 a 2.4 (con los complementos del mismo)
      -- Todos los js fuerón actualizados
      -- En este caso se ha dejado el autogrow
       
      ¿Porque con bootstrap 3.3.7 y no con bootrap 4.1?
      La verdad es que boostrap 4.1 ha sufrido muchos cambios(para bien) y al implementarlo deformaba todo el diseño y las funciones que tiene bs3 ya han sido eliminadas y es por esa razón que no use bs4 para poder actualizarlo.
       
      ¿Pero se puede hacer la actualización a bootstrap 4.1?
      Si pero esto llevará mucho tiempo y esfuerzo
       
      Se ha modificado la estructura.
      -- Buscar en inc/class/c.core.php y debajo de
      $this->settings['css'] = $this->settings['tema']['t_url'].'/css'; $this->settings['js'] = $this->settings['tema']['t_url'].'/js'; Agregan lo siguiente
      $this->settings['AdminLTE'] = $this->settings['tema']['t_url'].'/AdminLTE';  
      - Se cambio de lugar las redes sociales del posts.
       
      - Se integró el editor wysibb
       
      - Se eliminaron archivos totalmente innecesarios y/o que no se usan!
       
      En el caso que no se haya actualizado el iupload.php lo dejaré dentro del archivo y lo debe agregar en inc/php/
       
      Descargar Theme AdminLTE2.4
      Se instala con el mismo nombre.
      En el caso de encontrar errores por favor avisarme!
       
      Contiene un archivo leeme.txt que dice parte de este topic!
      Aviso es solo actualización, no he modificado el theme!
       
      ATENCIÓN: [No posee el archivo c.admin.php y c.registro.php] (actualizar registro topic actualizado)
      Se me olvido de poner el recaptcha v2 para el registro descargan este archivo AdminLTE2.4[registro] el cual solo tiene
      - registro.js [/js]
      - m.register-admin.tpl [/templates/modules/complementos]
      - m.admin_configs.tpl [/templates/admin_mods]
       
      30/05/2018
      He cometido un error he modificado el archivo m.register-admin.tpl y tenia que modificar el p.registro.form.tpl se puede comparar ambos archivos para realizar el cambio a p.registro.form.tpl con la ayuda de m.registrer-admin.tpl ya que ambos son muy similares..
       
      Acá le dejó en el caso que no quieran comparar, buscamos en p.registro.form.tpl
      <div class="input-group"> <label for="recaptcha_response_field">Ingresa el código de la imagen:</label> <div id="recaptcha_ajax"> <div id="recaptcha_image"></div> <input type="text" id="recaptcha_response_field" name="recaptcha_response_field" /> </div> <div class="help recaptcha"><span><em></em></span></div> </div> y la reemplazamos por
      <div class="input-group"> <label>Confirme humanidad:</label> <div class="g-recaptcha" data-sitekey="{$tsConfig.pkey}"></div> <div class="help"><span><em></em></span></div> </div> luego más abajo buscan
      y lo reemplazan por
      <script src="https://www.google.com/recaptcha/api.js" async defer></script> <script type="text/javascript"> $.getScript("{$tsConfig.js}/registro.js{literal}", function(){ registro.change_paso(1); mydialog.procesando_fin(); }); </script>  
      28/06/2018 (Hecho el día 03/06)
      Modificación para mostrar los iconos en los comentarios!

      Bueno para que aparezcan busca en AdminLTE->cool.css en la línea 1901
      background: url('images/sprite-comment.png') no-repeat; reemplazarlo con
      background: url('../images/sprite-comment.png') no-repeat;
  • Navegando Recientemente   0 miembros

    No registered users viewing this page.

  • Patrocinador



  • ×