Como mudar a aparencia deste botão?

2 participantes

Ir para baixo

Tópico resolvido Como mudar a aparencia deste botão?

Mensagem por MarcosSchultz 15.11.14 14:47

Detalhes da dúvida


Versão do fórum : Invision
Nível de acesso : Fundador
Navegador usado : Google Chrome
Membros afetados : Todos os membros do fórum
Endereço do fórum : www.schultzgames.com

Descrição do problema

Como posso mudar a aparencia deste botão???

Como mudar a aparencia deste botão? 21

como podem ver, O botão de ir ao topo da pagina não aparece, aparece apenas aquela setinha pequena fora de lugar.

e também aparecem 2 pontos na imagem, que estão apenas poluindo o visual do fórum.

Para fazer a alteração da aparencia dos botões estou usando este trecho de CSS

Código:

.pagination span a:link {
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
background: #f4f5f4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
border: solid 1px #DDD;
border-radius: 6px;
padding: 6px 10px;
color: #000;
}

 .pagination span a:link:hover, .pagination span strong:hover {
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border: solid 1px #DDD;
border-radius: 45px;
padding: 4px 15px;
background: #424242 url('');
color: #FFF;
padding: 4px 15px;
}

Vejam o bug em uma pagina como exemplo

http://www.schultzgames.com/f1-tutoriais-unity-3d

( precisa estar cadastrado para ver as partes escritas, más o bug em si já é visivel como visitante )


Última edição por MarcosSchultz em 15.11.14 22:40, editado 1 vez(es)
MarcosSchultz
MarcosSchultz
Membro

Membro desde : 19/09/2014
Mensagens : 548
Pontos : 758

http://schultzgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por Konai 15.11.14 14:53

Saudações!

Meu caro, aceda à: Painel de Controle >> Visualização >> Templates >> Geral >> viewforum_body
Procure pelo template "viewforum_body" e clique no botão Editar , logo após copie todo o conteúdo lá presente e mande-me aqui com as tags:
Código:
[code][/code]

Ficarei no aguardo! Contente
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por MarcosSchultz 15.11.14 15:42

Código:

<!-- BEGIN switch_user_logged_in --><p class="right rightside">{LAST_VISIT_DATE}</p><!-- END switch_user_logged_in -->
<p>{CURRENT_TIME}</p>

<h1 class="page-title"><a href="{U_VIEW_FORUM}">{FORUM_NAME}</a></h1>

{BOARD_INDEX}

<div class="pagination">
   <br />
   <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;&bull;&nbsp;
   <script type="text/javascript">//<![CDATA[
      var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
      var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
      var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
      var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
      var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
      insert_plus_menu_new('f{FORUM_ID}&amp;f={FORUM_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
   //]]>
   </script>
   {PAGINATION}
   <br /><br />
</div>

<div class="topic-actions">
<!-- BEGIN switch_user_authpost -->
   <div class="buttons">
      <div class="post-icon"><a href="{U_POST_NEW_TOPIC}" accesskey="n" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_ID}" alt="{L_POST_NEW_TOPIC}" /></a></div>
   </div>
<!-- END switch_user_authpost -->
   <div class="search-box">
      <form method="get" id="forum-search" action="{S_SEARCHBOX_ACTION}">
      <fieldset>
         <input class="inputbox search tiny" type="text" name="search_keywords" id="search_keywords" size="20" value="{L_SEARCH}" onclick="if (this.value == '{L_SEARCH}') this.value = '';" onblur="if (this.value == '') this.value = '{L_SEARCH}';" />
         &nbsp;<input class="button2" type="submit" value="{L_SEARCH}" />
         <input type="hidden" value="{SEARCH_WHERE}" name="search_where" />
      </fieldset>
      </form>
   </div>
   <p class="nomargin path" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a class="nav" href="{U_INDEX}" itemprop="url"><span itemprop="title">{L_INDEX}</span></a>
      {NAV_CAT_DESC}
   </p>
</div>

{TOPICS_LIST_BOX}

<div class="topic-actions">
   <!-- BEGIN switch_user_authpost -->
   <div class="buttons">
      <div class="post-icon"><a href="{U_POST_NEW_TOPIC}" accesskey="n" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_ID}" alt="{L_POST_NEW_TOPIC}" /></a></div>
   </div>
   <!-- END switch_user_authpost -->

   <div class="pagination">
      {PAGINATION}<br />
      <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>&nbsp;&bull;&nbsp;{S_WATCH_FORUM}&nbsp;&bull;&nbsp;<a href="#top">{L_BACK_TO_TOP}</a><br /><br />
   </div>
</div>

<div class="clear"></div>
<form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
   <fieldset class="vf_jumpbox">
      <label>{L_JUMP_TO}:&nbsp;</label>
      {S_JUMPBOX_SELECT}&nbsp;
      <input class="button2" type="submit" value="{L_GO}" />
   </fieldset>
</form>

{LOGGED_IN_USER_LIST}

<div id="info_open" style="display:block;clear:both">
<div class="h3">{L_MODERATOR}</div>
<p>{MODERATORS}</p>

<div class="h3">{L_TABS_PERMISSIONS}</div>
<p>{S_AUTH_LIST}</p>

</div>
<!-- BEGIN switch_legend -->
<div class="h3">{L_LEGEND}</div>
   <div class="clearfix">
      <ul class="ul-icons">
         <li><img src="{FOLDER_NEW_IMG}" alt="{L_FOLDER_NEW_IMG}" />&nbsp;{L_FOLDER_NEW_IMG}</li>
         <li><img src="{FOLDER_HOT_NEW_IMG}" alt="{L_FOLDER_HOT_NEW_IMG}" />&nbsp;{L_FOLDER_HOT_NEW_IMG}</li>
         <li><img src="{FOLDER_LOCKED_NEW_IMG}" alt="{L_FOLDER_LOCKED_NEW_IMG}" />&nbsp;{L_FOLDER_LOCKED_NEW_IMG}</li>
      </ul>
      <ul class="ul-icons">
         <li><img src="{FOLDER_IMG}" alt="{L_FOLDER_IMG}" />&nbsp;{L_FOLDER_IMG}</li>
         <li><img src="{FOLDER_HOT_IMG}" alt="{L_FOLDER_HOT_IMG}" />&nbsp;{L_FOLDER_HOT_IMG}</li>
         <li><img src="{FOLDER_LOCKED_IMG}" alt="{L_FOLDER_LOCKED_IMG}" />&nbsp;{L_FOLDER_LOCKED_IMG}</li>
      </ul>
      <ul class="ul-icons">
         <li><img src="{FOLDER_ANNOUNCE_IMG}" alt="{L_FOLDER_ANNOUNCE_IMG}" />&nbsp;{L_FOLDER_ANNOUNCE_IMG}</li>
         <li><img src="{FOLDER_STICKY_IMG}" alt="{L_FOLDER_STICKY_IMG}" />&nbsp;{L_FOLDER_STICKY_IMG}</li>
         <li><img src="{FOLDER_GLOBAL_ANNOUNCE_IMG}" alt="{L_FOLDER_GLOBAL_ANNOUNCE_IMG}" />&nbsp;{L_FOLDER_GLOBAL_ANNOUNCE_IMG}</li>
      </ul>
   </div>
<!-- END switch_legend -->
MarcosSchultz
MarcosSchultz
Membro

Membro desde : 19/09/2014
Mensagens : 548
Pontos : 758

http://schultzgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por Konai 15.11.14 15:44

Olá novamente!

Substitua por este código:
Código:
<!-- BEGIN switch_user_logged_in --><p class="right rightside">{LAST_VISIT_DATE}</p><!-- END switch_user_logged_in -->
<p>{CURRENT_TIME}</p>

<h1 class="page-title"><a href="{U_VIEW_FORUM}">{FORUM_NAME}</a></h1>

{BOARD_INDEX}

<div class="pagination">
  <br />
  <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>
  <script type="text/javascript">//<![CDATA[
      var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
      var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
      var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
      var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
      var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
      insert_plus_menu_new('f{FORUM_ID}&amp;f={FORUM_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
  //]]>
  </script>
  {PAGINATION}
  <br /><br />
</div>

<div class="topic-actions">
<!-- BEGIN switch_user_authpost -->
  <div class="buttons">
      <div class="post-icon"><a href="{U_POST_NEW_TOPIC}" accesskey="n" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_ID}" alt="{L_POST_NEW_TOPIC}" /></a></div>
  </div>
<!-- END switch_user_authpost -->
  <div class="search-box">
      <form method="get" id="forum-search" action="{S_SEARCHBOX_ACTION}">
      <fieldset>
        <input class="inputbox search tiny" type="text" name="search_keywords" id="search_keywords" size="20" value="{L_SEARCH}" onclick="if (this.value == '{L_SEARCH}') this.value = '';" onblur="if (this.value == '') this.value = '{L_SEARCH}';" />
        &nbsp;<input class="button2" type="submit" value="{L_SEARCH}" />
        <input type="hidden" value="{SEARCH_WHERE}" name="search_where" />
      </fieldset>
      </form>
  </div>
  <p class="nomargin path" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a class="nav" href="{U_INDEX}" itemprop="url"><span itemprop="title">{L_INDEX}</span></a>
      {NAV_CAT_DESC}
  </p>
</div>

{TOPICS_LIST_BOX}

<div class="topic-actions">
  <!-- BEGIN switch_user_authpost -->
  <div class="buttons">
      <div class="post-icon"><a href="{U_POST_NEW_TOPIC}" accesskey="n" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_ID}" alt="{L_POST_NEW_TOPIC}" /></a></div>
  </div>
  <!-- END switch_user_authpost -->

  <div class="pagination">
      {PAGINATION}<br />
      <a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a>{S_WATCH_FORUM}<a href="#top">{L_BACK_TO_TOP}</a><br /><br />
  </div>
</div>

<div class="clear"></div>
<form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
  <fieldset class="vf_jumpbox">
      <label>{L_JUMP_TO}:&nbsp;</label>
      {S_JUMPBOX_SELECT}&nbsp;
      <input class="button2" type="submit" value="{L_GO}" />
  </fieldset>
</form>

{LOGGED_IN_USER_LIST}

<div id="info_open" style="display:block;clear:both">
<div class="h3">{L_MODERATOR}</div>
<p>{MODERATORS}</p>

<div class="h3">{L_TABS_PERMISSIONS}</div>
<p>{S_AUTH_LIST}</p>

</div>
<!-- BEGIN switch_legend -->
<div class="h3">{L_LEGEND}</div>
  <div class="clearfix">
      <ul class="ul-icons">
        <li><img src="{FOLDER_NEW_IMG}" alt="{L_FOLDER_NEW_IMG}" />&nbsp;{L_FOLDER_NEW_IMG}</li>
        <li><img src="{FOLDER_HOT_NEW_IMG}" alt="{L_FOLDER_HOT_NEW_IMG}" />&nbsp;{L_FOLDER_HOT_NEW_IMG}</li>
        <li><img src="{FOLDER_LOCKED_NEW_IMG}" alt="{L_FOLDER_LOCKED_NEW_IMG}" />&nbsp;{L_FOLDER_LOCKED_NEW_IMG}</li>
      </ul>
      <ul class="ul-icons">
        <li><img src="{FOLDER_IMG}" alt="{L_FOLDER_IMG}" />&nbsp;{L_FOLDER_IMG}</li>
        <li><img src="{FOLDER_HOT_IMG}" alt="{L_FOLDER_HOT_IMG}" />&nbsp;{L_FOLDER_HOT_IMG}</li>
        <li><img src="{FOLDER_LOCKED_IMG}" alt="{L_FOLDER_LOCKED_IMG}" />&nbsp;{L_FOLDER_LOCKED_IMG}</li>
      </ul>
      <ul class="ul-icons">
        <li><img src="{FOLDER_ANNOUNCE_IMG}" alt="{L_FOLDER_ANNOUNCE_IMG}" />&nbsp;{L_FOLDER_ANNOUNCE_IMG}</li>
        <li><img src="{FOLDER_STICKY_IMG}" alt="{L_FOLDER_STICKY_IMG}" />&nbsp;{L_FOLDER_STICKY_IMG}</li>
        <li><img src="{FOLDER_GLOBAL_ANNOUNCE_IMG}" alt="{L_FOLDER_GLOBAL_ANNOUNCE_IMG}" />&nbsp;{L_FOLDER_GLOBAL_ANNOUNCE_IMG}</li>
      </ul>
  </div>
<!-- END switch_legend -->
Salve OK e publique o Adicionar template!

Atenciosamente,
Hakuouki Piscada
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por MarcosSchultz 15.11.14 16:18

show, os pontos sumiram. Más a seta de ir para o topo ainda está em forma de seta e não de botão. isso tem a ver com a Css ne?
MarcosSchultz
MarcosSchultz
Membro

Membro desde : 19/09/2014
Mensagens : 548
Pontos : 758

http://schultzgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por Konai 15.11.14 16:23

Para modificar esta seta, nós temos duas opções: pelo painel de controle ou por CSS.

Pelo painel: Painel de Controle >> Visualização >> Imagens e Cores >> Gestão das imagens >> Modo Avançado >> Aba 'Mini ícones'
Procure por "Voltar ao Topo" e modifique a imagem para o link(url) da imagem desejada. OK

Por CSS: Painel de Controle >> Visualização >> Imagens e Cores >> Cores >> Folha de estilo CSS

Código:
Código:
img.sprite-arrow_prosilver_up {
background: url('URL_DA_IMAGEM') no-repeat top left !important;
}

Atenciosamente,
Hakuouki Contente
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por MarcosSchultz 15.11.14 18:08

Já serve. más a seta desapareceu. gostaria que ela ficasse em algum canto ( se possivel ) se não for possivel ta bom de qualquer maneira ^^
MarcosSchultz
MarcosSchultz
Membro

Membro desde : 19/09/2014
Mensagens : 548
Pontos : 758

http://schultzgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como mudar a aparencia deste botão?

Mensagem por Konai 15.11.14 19:49

Tente substituir por este CSS:
Código:
.sprite-arrow_prosilver_up {
background: url(URL) no-repeat top left;
}

Até! Contente
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos