Página 1 de 1
Como inserir uma imagem de background no estilo we_universal
Enviado: 21 Set 2012, 00:00
por killizein
Qual a URL do seu fórum: Localhost
Tipo de Hospedagem: Free
Qual a versão do phpBB: phpBB 3.0.10
É um novo ou uma conversão: Instalação Limpa
Usuário de teste: Usuário: N/D Senha: N/D
Estilos instalados: we_universal
Modificações instaladas: Nenhuma.
Qual seu nivel de experiência: Iniciante em PHP mas tenho noções básicas de webstandards, css, xhtml.
Quando começou o problema: Não há um problema, tenho apenas algumas dúvidas. Instalei o phpbb3 para testar antes de começar a utilizar a plataforma num servidor pago.
Descreva seu problema: Como faço para mudar o background do style we_universal ? Gostaria de colocar uma imagem específica.
Já li oartigo Como colorir Prosilver que lhe ajudará bastante nas alterações pretendidas e Identificar e interagir com elementos da página
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 00:16
por _Vinny_
No artigo Como colorir Prosilver deve haver as instruções para mudar o fundo.
Basicamente você deve abrir o arquivo colours.css
do estilo e adicionar/editar a propriedade backgroud-color
ou backgroud-image
em body
.
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 00:27
por killizein
Já tentei e não funcionou.
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 00:34
por _Vinny_
Após a edição, você deve atualizar o componente editado: ACP > aba Estilos > link Temas > we_universal - Atualizar
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 00:42
por killizein
Sim. Já fiz isso também.
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 14:36
por _Vinny_
Poste aqui o seu colours.css
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 16:12
por killizein
Código: Selecionar todos
/*
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */
html, body {
color: #666;
}
h1 {
color: #fff;
}
h2 {
color: #28313F;
}
h3 {
border-bottom-color: #ccc;
color: #444;
}
hr {
border-color: #FFFFFF;
border-top-color: #CCCCCC;
}
hr.dashed {
border-top-color: #CCCCCC;
}
/* Name and description
---------------------------------------- */
#site-description a {
color: #fff;
}
/* Round cornered boxes and backgrounds
---------------------------------------- */
.panel {
background-color: #f1f1f1;
color: #666;
}
.post:target h3 a {
color: #000000;
}
.bg1 { background-color: #ececec; }
.bg2 { background-color: #f4f4f4; }
.bg3 { background-color: #e1e1e1; }
.forums .bg1 { background-color: #fafcfe; }
.forums .bg2 { background-color: #f2f2f2; }
.forums .bg1 .bg2 { background-color: #f1f1f1; }
.forums .bg2 .bg2{ background-color: #e9e9e9; }
.ucprowbg {
background-color: #DCDEE2;
}
.fieldsbg {
background-color: #E7E8EA;
}
span.corners-top, span.corners-bottom {
background-image: url("{T_THEME_PATH}/images/corners_left.png");
}
span.corners-top span, span.corners-bottom span {
background-image: url("{T_THEME_PATH}/images/corners_right.png");
}
/* Horizontal lists
----------------------------------------*/
ul.navlinks {
border-bottom-color: #FFFFFF;
}
/* Table styles
----------------------------------------*/
table.table1 thead th {
color: #fff;
}
table.table1 tbody tr {
border-color: #BFC1CF;
}
table.table1 tbody tr:hover, table.table1 tbody tr.hover {
background-color: #f8f7de;
color: #000;
}
table.table1 td {
color: #666;
}
table.table1 tbody td {
border-bottom: 1px solid #c1c1c1;
border-right: 1px solid #c1c1c1;
}
table.table1 tbody td:last-child {
border-right: none;
}
table.table1 tbody tr:last-child td {
border-bottom: none;
}
table.table1 tbody th {
border-bottom-color: #000000;
color: #333333;
background-color: #FFFFFF;
}
table.info tbody th {
color: #000000;
}
/* Misc layout styles
---------------------------------------- */
dl.details dt {
color: #333;
}
dl.details dd {
color: #666;
}
.sep {
color: #1198D9;
}
/* Pagination
---------------------------------------- */
.pagination span strong {
color: #9b9b9b;
background-color: #f5f5f5;
border-color: #cecece;
}
.pagination span a, .pagination span a:link, .pagination span a:visited {
color: #666;
background-color: #eaeaea;
border-color: #bababa;
}
.pagination span a:active {
color: #5C758C;
background-color: #ECEDEE;
border-color: #B4BAC0;
}
.pagination span a:hover {
border-color: #bc2a4d;
background-color: #fff;
color: #bc2a4d;
}
/* Pagination in viewforum for multipage topics */
.row .pagination {
background-image: url("{T_THEME_PATH}/images/icon_pages.gif");
}
.row .pagination span a, li.pagination span a {
background-color: #fff;
}
.row .pagination span a:hover, li.pagination span a:hover {
background-color: #fff;
}
/* Miscellaneous styles
---------------------------------------- */
.copyright {
color: #888;
}
.error, div.rules {
background-color: #ECD5D8;
background-image: none;
border: 1px solid #deb7b7;
color: #bc2a4d;
}
.reported {
background-color: #F7ECEF !important;
}
.reported .bg2 {
background-color: #f4e1e6 !important;
}
li.reported:hover {
background-color: #f2dfe1 !important;
}
p.rules {
background-color: #ECD5D8;
background-image: none;
}
/*
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */
a:link { color: #444; }
a:visited { color: #444; }
a:hover, a:focus { color: #c20031; }
/* Links for forum/topic lists */
a.forumtitle, a.topictitle {
color: #52575b;
}
a.topictitle:visited {
color: #777;
}
a.forumtitle:hover, a.topictitle:hover {
color: #BC2A4D;
}
/* Post body links */
.subject {
color: #444;
}
.postlink {
color: #666;
text-decoration: none;
}
.postlink:visited {
color: #888;
}
.postlink:hover {
color: #c20031;
}
.signature a, .signature a:visited, .signature a:hover, .signature a:active {
background-color: transparent;
}
/* Profile links */
.postprofile a:link, .postprofile a:visited, .postprofile dt.author a {
color: #444;
}
.postprofile a:hover, .postprofile dt.author a:hover {
color: #c20031;
}
.postprofile a:active {
color: #c20031;
}
/* Profile searchresults */
.search .postprofile a {
color: #444;
}
.search .postprofile a:hover {
color: #c20031;
}
/* Back to top of page */
a.top {
background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}
a.top2 {
background-image: url("{IMG_ICON_BACK_TOP_SRC}");
}
/* Arrow links */
a.up { background-image: url("{T_THEME_PATH}/images/arrow_up.gif") }
a.down { background-image: url("{T_THEME_PATH}/images/arrow_down.gif") }
a.left { background-image: url("{T_THEME_PATH}/images/arrow_left.gif") }
a.right { background-image: url("{T_THEME_PATH}/images/arrow_right.gif") }
a.up:hover {
background-color: transparent;
}
a.left:hover, a.right:hover {
color: #c20031;
}
/*
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */
ul.topiclist li {
color: #666;
}
ul.topiclist dd {
border-left-color: #FFFFFF;
}
.rtl ul.topiclist dd {
border-right-color: #fff;
border-left-color: transparent;
}
.forums-wrapper .row a.subforum.read {
background-image: url("{IMG_SUBFORUM_READ_SRC}");
}
.forums-wrapper .row a.subforum.unread {
background-image: url("{IMG_SUBFORUM_UNREAD_SRC}");
}
/* Forum list column styles */
ul.topiclist dd.searchextra {
color: #333333;
}
/* Post body styles
----------------------------------------*/
.postbody {
color: #333;
}
/* Content container styles
----------------------------------------*/
.content {
color: #444;
}
.content h2, .panel h2 {
color: #3f3f3f;
border-bottom-color: #ccc;
}
dl.faq dt {
color: #333333;
}
.posthilit {
background-color: #F3BFCC;
color: #BC2A4D;
}
/* Post signature */
.signature {
border-top-color: #ccc;
}
/* Post noticies */
.notice {
background: #f3dddd;
border-color: #deb7b7;
}
/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
background-color: #f9f9f9;
background-image: url("{T_THEME_PATH}/images/quote.gif");
border-color: #ddd;
}
.rtl blockquote {
background-image: url("{T_THEME_PATH}/images/quote_rtl.gif");
}
blockquote blockquote {
/* Nested quotes */
background-color:#f1f1f1;
}
blockquote blockquote blockquote {
/* Nested quotes */
background-color: #e9e9e9;
}
/* Code block */
dl.codebox {
background-color: #fff;
border-color: #ddd;
}
dl.codebox dt {
border-bottom-color: #ddd;
}
dl.codebox code {
color: #2E8B57;
}
.syntaxbg { color: #FFFFFF; }
.syntaxcomment { color: #FF8000; }
.syntaxdefault { color: #0000BB; }
.syntaxhtml { color: #000000; }
.syntaxkeyword { color: #007700; }
.syntaxstring { color: #DD0000; }
/* Attachments
----------------------------------------*/
.attachbox {
background-color: #FFFFFF;
border-color: #C9D2D8;
}
.pm-message .attachbox {
background-color: #F2F3F3;
}
.attachbox dd {
border-top-color: #C9D2D8;
}
.attachbox p {
color: #666666;
}
.attachbox p.stats {
color: #666666;
}
.attach-image img {
border-color: #999999;
}
/* Inline image thumbnails */
dl.file dd {
color: #666666;
}
dl.thumbnail img {
border-color: #666666;
background-color: #FFFFFF;
}
dl.thumbnail dd {
color: #666666;
}
dl.thumbnail dt a:hover {
background-color: #EEEEEE;
}
dl.thumbnail dt a:hover img {
border-color: #c20031;
}
/* Post poll styles
----------------------------------------*/
fieldset.polls dl {
border-top-color: #dcdcdc;
color: #666666;
}
fieldset.polls dl.voted {
color: #000000;
}
fieldset.polls dd div {
color: #FFFFFF;
}
.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
border-right-color: transparent;
}
.pollbar1 {
background-color: #c20031;
border-bottom-color: #942a43;
border-right-color: #942a43;
}
.rtl .pollbar1 {
border-left-color: #942a43;
}
.pollbar2 {
background-color: #BE1E4A;
border-bottom-color: #8C1C38;
border-right-color: #8C1C38;
}
.rtl .pollbar2 {
border-left-color: #8C1C38;
}
.pollbar3 {
background-color: #D11A4E;
border-bottom-color: #AA2346;
border-right-color: #AA2346;
}
.rtl .pollbar3 {
border-left-color: #AA2346;
}
.pollbar4 {
background-color: #E41653;
border-bottom-color: #BE1E4A;
border-right-color: #BE1E4A;
}
.rtl .pollbar4 {
border-left-color: #BE1E4A;
}
.pollbar5 {
background-color: #d61c54;
border-bottom-color: #b8294b;
border-right-color: #b8294b;
}
.rtl .pollbar5 {
border-left-color: #b8294b;
}
/* Poster profile block
----------------------------------------*/
.postprofile {
color: #666666;
border-left-color: #FFFFFF;
}
.rtl .postprofile {
border-right-color: #FFFFFF;
border-left-color: transparent;
}
.pm .postprofile {
border-left-color: #DDDDDD;
}
.rtl .pm .postprofile {
border-right-color: #DDDDDD;
border-left-color: transparent;
}
.profile-details strong {
color: #333;
}
/*
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */
/* Big button images */
.reply-icon span { background-image: url("{IMG_BUTTON_TOPIC_REPLY_SRC}"); }
.post-icon span { background-image: url("{IMG_BUTTON_TOPIC_NEW_SRC}"); }
.locked-icon span { background-image: url("{IMG_BUTTON_TOPIC_LOCKED_SRC}"); }
.pmreply-icon span { background-image: url("{IMG_BUTTON_PM_REPLY_SRC}") ;}
.newpm-icon span { background-image: url("{IMG_BUTTON_PM_NEW_SRC}") ;}
.forwardpm-icon span { background-image: url("{IMG_BUTTON_PM_FORWARD_SRC}") ;}
a.print {
background-image: url("{T_THEME_PATH}/images/icon_print.gif");
}
a.sendemail {
background-image: url("{T_THEME_PATH}/images/icon_sendemail.gif");
}
a.subscribe {
background-image: url("{T_THEME_PATH}/images/icon_subscribe.gif");
}
a.unsubscribe {
background-image: url("{T_THEME_PATH}/images/icon_unsubscribe.gif");
}
a.bookmark {
background-image: url("{T_THEME_PATH}/images/icon_bookmark.gif");
}
a.bump {
background-image: url("{T_THEME_PATH}/images/icon_bump.gif");
}
/* Icon images
---------------------------------------- */
.sitehome { background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-faq { background-image: url("{T_THEME_PATH}/images/icon_faq.gif"); }
.icon-members { background-image: url("{T_THEME_PATH}/images/icon_members.gif"); }
.icon-home { background-image: url("{T_THEME_PATH}/images/icon_home.gif"); }
.icon-ucp { background-image: url("{T_THEME_PATH}/images/icon_ucp.gif"); }
.icon-register { background-image: url("{T_THEME_PATH}/images/icon_register.gif"); }
.icon-logout { background-image: url("{T_THEME_PATH}/images/icon_logout.gif"); }
.icon-bookmark { background-image: url("{T_THEME_PATH}/images/icon_bookmark.gif"); }
.icon-bump { background-image: url("{T_THEME_PATH}/images/icon_bump.gif"); }
.icon-subscribe { background-image: url("{T_THEME_PATH}/images/icon_subscribe.gif"); }
.icon-unsubscribe { background-image: url("{T_THEME_PATH}/images/icon_unsubscribe.gif"); }
.icon-pages { background-image: url("{T_THEME_PATH}/images/icon_pages.gif"); }
.icon-search { background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }
/* Profile & navigation icons */
.email-icon, .email-icon a { background-image: url("{IMG_ICON_CONTACT_EMAIL_SRC}"); }
.aim-icon, .aim-icon a { background-image: url("{IMG_ICON_CONTACT_AIM_SRC}"); }
.yahoo-icon, .yahoo-icon a { background-image: url("{IMG_ICON_CONTACT_YAHOO_SRC}"); }
.web-icon, .web-icon a { background-image: url("{IMG_ICON_CONTACT_WWW_SRC}"); }
.msnm-icon, .msnm-icon a { background-image: url("{IMG_ICON_CONTACT_MSNM_SRC}"); }
.icq-icon, .icq-icon a { background-image: url("{IMG_ICON_CONTACT_ICQ_SRC}"); }
.jabber-icon, .jabber-icon a { background-image: url("{IMG_ICON_CONTACT_JABBER_SRC}"); }
.pm-icon, .pm-icon a { background-image: url("{IMG_ICON_CONTACT_PM_SRC}"); }
.quote-icon, .quote-icon a { background-image: url("{IMG_ICON_POST_QUOTE_SRC}"); }
/* Moderator icons */
.report-icon, .report-icon a { background-image: url("{IMG_ICON_POST_REPORT_SRC}"); }
.edit-icon, .edit-icon a { background-image: url("{IMG_ICON_POST_EDIT_SRC}"); }
.delete-icon, .delete-icon a { background-image: url("{IMG_ICON_POST_DELETE_SRC}"); }
.info-icon, .info-icon a { background-image: url("{IMG_ICON_POST_INFO_SRC}"); }
.warn-icon, .warn-icon a { background-image: url("{IMG_ICON_USER_WARN_SRC}"); } /* Need updated warn icon */
/*
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */
/* Main CP box
----------------------------------------*/
#cp-main h3, #cp-main hr, #cp-menu hr {
border-color: #ccc;
}
#cp-main .panel li.row {
border-top-color: #fff;
border-bottom-color: #ccc;
}
ul.cplist {
border-top-color: #ccc;
}
#cp-main .panel li.header dd, #cp-main .panel li.header dt {
color: #000000;
}
#cp-main table.table1 thead th {
color: #333333;
border-bottom-color: #333333;
}
#cp-main .pm-message {
border-color: #DBDEE2;
background-color: #FFFFFF;
}
/* CP tabbed menu
----------------------------------------*/
#tabs a {
background-image: url("{T_THEME_PATH}/images/bg_tabs1.gif");
}
#tabs a span {
background-image: url("{T_THEME_PATH}/images/bg_tabs2.gif");
color: #828282;
}
#tabs a:hover span {
color: #c20031;
}
#tabs .activetab a {
border-bottom-color: #ececec;
}
#tabs .activetab a span {
color: #3c3c3c;
}
#tabs .activetab a:hover span {
color: #000;
}
/* Mini tabbed menu used in MCP
----------------------------------------*/
#minitabs li {
background-color: #d9d9d9;
color: #555;
}
#minitabs li.activetab {
background-color: #cecece;
color: #c20031;
}
#minitabs li:hover {
background-color: #cecece;
}
#minitabs li.activetab a, #minitabs li.activetab a:hover {
background-color: #F9F9F9;
color: #d31141;
}
/* UCP navigation menu
----------------------------------------*/
/* Link styles for the sub-section links */
#navigation a, .rtl #navigation a {
color: #555;
background-color: #d9d9d9;
}
#navigation a:hover {
background-color: #cecece;
color: #c20031;
}
#navigation #active-subsection a {
color: #D31141;
background-color: #F9F9F9;
background-image: none;
}
#navigation #active-subsection a:hover {
color: #D31141;
}
/* Preferences pane layout
----------------------------------------*/
#cp-main h2 {
color: #333333;
}
#cp-main .panel {
background-color: #F9F9F9;
}
#cp-main .pm {
background-color: #FFFFFF;
}
#cp-main span.corners-top, #cp-menu span.corners-top {
background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}
#cp-main span.corners-top span, #cp-menu span.corners-top span {
background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}
#cp-main span.corners-bottom, #cp-menu span.corners-bottom {
background-image: url("{T_THEME_PATH}/images/corners_left2.gif");
}
#cp-main span.corners-bottom span, #cp-menu span.corners-bottom span {
background-image: url("{T_THEME_PATH}/images/corners_right2.gif");
}
/* Topicreview */
#cp-main .panel #topicreview span.corners-top, #cp-menu .panel #topicreview span.corners-top {
background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}
#cp-main .panel #topicreview span.corners-top span, #cp-menu .panel #topicreview span.corners-top span {
background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}
#cp-main .panel #topicreview span.corners-bottom, #cp-menu .panel #topicreview span.corners-bottom {
background-image: url("{T_THEME_PATH}/images/corners_left.gif");
}
#cp-main .panel #topicreview span.corners-bottom span, #cp-menu .panel #topicreview span.corners-bottom span {
background-image: url("{T_THEME_PATH}/images/corners_right.gif");
}
/* Friends list */
.cp-mini {
background-color: #f9f9f9;
}
dl.mini dt {
color: #52575b;
}
/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
color: #000000 !important;
}
/* PM marking colours */
.pmlist .pm_message_reported_colour, .pm_message_reported_colour {
border-left-color: #BC2A4D;
border-right-color: #BC2A4D;
}
.pmlist .pm_marked_colour, .pm_marked_colour {
border-color: #FF6600;
}
.pmlist .pm_replied_colour, .pm_replied_colour {
border-color: #A9B8C2;
}
.pmlist .pm_friend_colour, .pm_friend_colour {
border-color: #5D8FBD;
}
.pmlist .pm_foe_colour, .pm_foe_colour {
border-color: #000000;
}
/* Avatar gallery */
#gallery label {
background-color: #FFFFFF;
border-color: #CCC;
}
#gallery label:hover {
background-color: #EEE;
}
/*
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */
/* General form styles
----------------------------------------*/
select {
border-color: #888;
background-color: #FAFAFA;
color: #000;
}
label {
color: #666;
}
option.disabled-option {
color: graytext;
}
/* Definition list layout for forms
---------------------------------------- */
dd label {
color: #333;
}
/* Hover effects */
fieldset dl:hover dt label {
color: #000000;
}
fieldset.fields2 dl:hover dt label {
color: inherit;
}
/* Quick-login on index page */
fieldset.quick-login input.inputbox {
background-color: #efefef;
}
/* Posting page styles
----------------------------------------*/
#message-box textarea {
color: #333333;
}
/* Input field styles
---------------------------------------- */
.inputbox {
background-color: #fefefe;
border-color: #c2c2c2;
color: #333;
}
.inputbox:focus {
background-color: #fff;
border-color: #aeaeae;
}
/* Form button styles
---------------------------------------- */
a.button1, input.button1, input.button3, a.button2, input.button2 {
color: #000;
background-color: #FAFAFA;
background-image: url("{T_THEME_PATH}/images/bg_button.gif");
}
a.button1, input.button1 {
border-color: #666666;
}
input.button3 {
background-image: none;
}
/* Alternative button */
a.button2, input.button2, input.button3 {
border-color: #666666;
}
/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
color: #000000;
}
/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
border-color: #BC2A4D;
color: #BC2A4D;
}
input.search {
background: url("{T_THEME_PATH}/images/icon_textbox_search.gif") 1px 3px no-repeat;
}
input.disabled {
color: #666666;
}
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 21 Set 2012, 16:49
por killizein
Achei um fórum semelhante na web, com o mesmo style e imagem de background
http://www.2012apocalypse.pl/
Sou novato nesta área de customização, então procurei com o Firebug e achei "style...3c2d548".
Código: Selecionar todos
body {
background-attachment: fixed;
background-clip: border-box;
background-color: #F9F9F9;
background-image: url("./styles/we_universal/theme/images/bf3wall.jpg");
background-origin: padding-box;
background-position: 0 0;
background-repeat: no-repeat;
background-size: cover;
font: 62.5% Verdana,Arial,Helvetica,sans-serif;
margin: 15px 0;
}
Porém não consigo encontrar onde está este css, porque ele não é exibido no firebug com a extensão ".css". Se eu o encontrar acho que se torna relativamente facil.
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 22 Set 2012, 17:17
por _Vinny_
Poste aqui também o seu arquivo common.css
. Pois no seu colours.css
não há nenhuma identifição de customização do fundo.
Re: Como inserir uma imagem de background no estilo we_unive
Enviado: 23 Set 2012, 02:03
por killizein
Resolvi o problema sozinho. Mas obrigado pela ajuda.