FANDOM


CommentPreview fornece um botão de pré-visualização para comentários de artigos e blog.

Installation

Importando vários scripts? Este guia rápido mostra como combinar as importações.
  • Para uso em todo o site, um administrador pode adicionar a linha abaixo para a página MediaWiki:ImportJS da wiki.
dev:CommentPreview/code.js
  • Para uso pessoal, adicione o snippet de código abaixo para a sua página global.js (para uso em todos os wikis) ou sua página common.js no seu wiki (para uso em uma wiki única). Observe que JS pessoal deve estar habilitado para sua conta.
importArticles({
    type: 'script',
    articles: [
        'u:dev:MediaWiki:CommentPreview/code.js',
    ]
});

Usage

Não há condições especiais para uso do script
Language precedence: uselang (url -> script settings) -> wgContentLanguage -> en.

Configuração

É possível definir algumas opções: configurar o modo de depuração, selecionar o idioma e adicionar novo suporte ao idioma, etc.

Criar um objeto de configuração (faça isso primeiro)
window.fng = $.extend(true, window.fng, {cp: (window.fng || {}).cp || {} });
Enable debug mode
window.fng.cp.debug = true; Este modo pode ser ativado através do parâmetro debug. Exemplo: /wiki/article?debug=1
Select language
window.fng.cp.uselang = 'lang'; Onde lang é o código do idioma (en, ru, etc). Por padrão, o idioma do conteúdo será usado (ver precedência do idioma acima) com en como retorno final. O parâmetro uselang tem precedência. Exemplo: /wiki/article?uselang=en vai selecionar inglês independente de quaisquer configurações.
Adicionar idioma

window.fng.cp.lang = $.extend(true, {}, window.fng.cp.lang, {
    lang1: {preview: 'preview text', cancel: 'cancel text', publish: 'publish text'},
    lang2: {preview: 'preview text'}
});

Onde lang1 e lang2 são códigos de idioma (en, es etc); texto de visualização, cancelar texto e publicar texto é texto para o botão correspondente. Qualquer quantidade de idiomas separados por vírgulas pode ser adicionada. Se alguns parâmetros forem perdidos, o idioma de retorno será usado (veja o precedente do idioma acima).

Nota: é possível adicionar o idioma diretamente no código. Pode-se sugerir um novo idioma, ou adicioná-lo no script, se for da família JS.

Change throbber
window.fng.cp.throbber = 'image';
Onde image é um caminho completo para a imagem do Throbber. Apenas fontes relacionadas a wikia são permitidas. (*.wikia.com and *.wikia.nocookie.net).

Classes

There is some classes to help style the preview.

cp-modal
main container aka modal wrapper.
cp-window
preview window.
cp-header
header. Header text lies in the H1 element.
cp-xcancel
X button in the header.
cp-content
preview body. Inner content has page-like styling.
cp-footer
preview footer. Cancel and Publish buttons lies here.
cp-button
buttons shares that class. Also, every button has own class: preview: cp-button-preview; publish: cp-button-publish; cancel: cp-button-cancel.

Note: you will have to use !important to override some styles. Do not override float property for .cp-button-preview. For realsies.

Forums' preview module styling

By default, this script's module interface does not use the styling of the preview modules found on Message Walls and on Special:Forum. As it aims for a basic interface that could work on any wiki, and encourages users to design it to their liking using the CSS classes mentioned on the previous section.

However, if you want a similar style to the one these mentioned features use on this script's module as well, you can put this snippet of code into your Wiki's Wikia.css:

 
.cp-footer {
    background-color: your color here; /* The background color for the footer */  
    padding: 14px;
}
.cp-header h1 {
    background-color: your color here; /* The background color for the header */ 
    width: 102.6%;
    padding: 16px;
    margin-left: -25px;
    margin-top: -10px;
    font-size: 20px;
    font-weight: bold;
}
.cp-window {
    background-color: your color here !important; /* The background color for the rest of the module*/
    height: 450px !important;
}
.cp-content {
    margin-top: 23px !important;
    border-color: your color here !important; /* The border color displayed around the content area on the module */
}
.cp-content .WikiaArticle .mw-content-ltr p{
    margin: .8em 0 .6em;
    margin-left: 8px;
}
.cp-xcancel {
    font-size: 30px !important;
    text-decoration: none !important;
    color: black !important;
    padding-top: 15px;
}
.cp-button-preview {
    margin-right: -8px !important;
}

Note: The "your color here" text must be replaced with the name of the color you would like to use.

Community content is available under CC-BY-SA unless otherwise noted.

Fandom may earn an affiliate commission on sales made from links on this page.

Stream the best stories.

Fandom may earn an affiliate commission on sales made from links on this page.

Get Disney+