Como criar um plug-in de widget do WordPress

Publicados: 2022-10-02

Se você é fã do WordPress, provavelmente está familiarizado com widgets. Widgets são aquelas pequenas caixas que você pode adicionar à sua barra lateral ou outras áreas do seu tema prontas para widgets. Eles geralmente contêm informações como postagens recentes do seu blog, seu feed do Twitter ou um calendário. Mas você sabia que pode criar seus próprios widgets? Na verdade é bem fácil de fazer. Neste artigo, mostraremos como criar um plug-in de widget do WordPress. Começaremos criando um arquivo de plug-in básico e, em seguida, adicionando uma classe de widget . Em seguida, registraremos nosso widget para que ele apareça no administrador do WordPress. Por fim, adicionaremos algum código para exibir nosso widget no front-end do nosso site. Vamos começar!

Recentemente, desenvolvi um plugin chamado Freelancer Widgets Bundle. Quando me perguntaram o que eu deveria escrever para um plugin, pensei que era hora de escrever este post porque as pessoas haviam perguntado sobre isso. Quando você instala um plugin do WordPress, é necessário adicionar um código extra a ele. Você precisará de um editor como Coda (Mac) ou Dreamweaver (PC) para desenvolver seu plugin. O construtor é a função que define o nome e os argumentos principais do widget; este é um exemplo de como pode ficar. Ao fazer alterações nos campos do formulário, certifique-se de usar esc_attr(), pois isso é feito por motivos de segurança. O parâmetro 'customize_selective_refresh' permite que o widget seja atualizado em Aparência, bem como ao editá-lo.

Em outras palavras, as alterações no widget não precisam ser atualizadas para que apareçam na lista. Todas as tags, exceto o texto básico, são removidas com WP_strip_all_tags. WP_kses_post_string() é a mesma função que a string de conteúdo do post. Esta função irá gerar conteúdo para um site usando a função widget(). Essa função pode ser personalizada para incluir uma tag ou classe específica. O GitHub é o local ideal para visualizar todo o código.

Quando você quiser adicionar o widget a um site, vá para a página em que deseja fazer isso e cole o código antes que a tag HTML “/body” seja fechada. É necessário incluir o código em cada página da web que você deseja exibir o widget. Verifique seu firewall para ver se o Web Widget (Clássico) está ativado.

Ambos são criaturas visuais, mas possuem características distintas, como visibilidade e interação. Se sua página estiver funcionando sem problemas e corretamente em segundo plano, este é um plugin. Para que um usuário interaja com ele na página, ele deve estar visível para o usuário.

Como faço para criar um plug-in de widget personalizado para WordPress?

Para criar um plugin de widget personalizado para WordPress, você precisará criar um arquivo PHP com o seguinte código: /* Nome do plugin: [Nome do plugin] Descrição: [Descrição do plugin] */ // Registrar e carregar o widget function [name_of_plugin]_load_widget() { register_widget( '[name_of_plugin]'); } add_action( 'widgets_init', '[name_of_plugin]_load_widget' ); // Criando a classe de widget [name_of_plugin] extends WP_Widget { function __construct() { parent::__construct( // Base ID do seu widget '[name_of_plugin]', // O nome do widget aparecerá na interface do usuário __('[Nome do plugin ]', '[name_of_plugin]'), // Descrição do widget array( 'description' => __( '[Descrição do plugin]', '[name_of_plugin]' ), ) ); } // Criando o front-end do widget // Aqui é onde a ação acontece public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); // os argumentos antes e depois do widget são definidos por temas echo $args['before_widget']; if (! empty( $title)) echo $args['before_title'] . $título. $args['after_title']; // Aqui é onde você executa o código e exibe a saída echo __( '[Nome do plugin]', '[nome_do_plugin]' ); echo $args['after_widget']; } // Widget Backend public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) { $title = $instance[ 'title' ]; } else { $title = __( '[Nome do plugin]', '[nome_do_plugin]'); } // Formulário de administração do widget? > Quando os usuários do WordPress criam uma área de widget, eles adicionam pequenos pedaços de conteúdo a essa área. Dependendo da área do widget em que está instalado, um widget pode exibir vários tipos de informações em todas as páginas ou pode exibir apenas determinadas informações. Existem alguns widgets que são disponibilizados por padrão, enquanto outros são disponibilizados utilizando um plugin ou tema. Os quatro métodos mencionados acima devem ser adicionados à sua classe para criar um widget personalizado básico. Você deve usar a função register_widget() para registrar o widget para usá-lo no painel. Antes de estudarmos o exemplo que apresentamos neste artigo, examinaremos rapidamente o objetivo de cada seção do código. Um dos métodos usados ​​na classe Custom_Widget é um método para atribuir caracteres. Criamos o widget com o custom_widget como seu ID com o método construtor usando o método __construct(). Usando o método register_widget(), um novo widget é criado após o existente ter sido registrado. Envolvemos cada uma das partes com instruções if…* para garantir que apenas essas partes sejam exibidas se estiverem incluídas nas opções do widget. O método widget() incluiu a função nl2br() para garantir que todos os textos de vários parágrafos sejam exibidos corretamente. higieniza_texto_campo() elimina espaços em branco desnecessários, tabulações e quebras de linha do argumento. Além disso, o valor Yes é definido como padrão no campo de seleção, indicando que o destino do link está definido como _blank nos dois casos anteriores. O título, texto, link abaixo do título e se o link deve ser aberto em uma nova guia devem ser especificados. Salve as opções que você escolheu clicando no botão Salvar imediatamente. Quando você seleciona um tema padrão, o widget produzirá uma saída diferente. Nesse caso, seu widget pode ser muito parecido com o mostrado abaixo se você usar o tema Lekker WordPress. Como criar um widget de imagem personalizado no WordPress? Para adicionar uma imagem a uma barra lateral do WordPress, selecione o widget 'Imagem'. Você pode fazer alterações em sua aparência acessando Aparência. Adicione o widget 'Imagem' à barra lateral se você tiver uma página que inclua um widget.Plugin de widget personalizadoCredit: octobercms.comUm plugin de widget personalizado é um plugin que permite que você crie seu próprio widget personalizado. Este plugin é ótimo para quem deseja criar um widget personalizado para seu site ou blog. Com este plugin, você pode criar facilmente um widget personalizado sem precisar codificá-lo. Para fornecer um widget personalizado que possa ser usado com o Qt Designer, precisamos fornecer uma implementação independente, bem como uma interface de plugin. O widget personalizado deste exemplo, como seu equivalente de relógio analógico, não possui nenhum sinal ou slot personalizado. A macro Q_PLUGIN_METADATA() deve ser usada para garantir que o widget seja identificado corretamente como um plugin exportando os dados dele. A classe AnalogClock pode ser usada como um widget personalizado dentro da caixa de widgets e é um exemplo de classe independente. Uma classe de plugin para a classe AnalogClock está incluída no Qt Designer. O construtor da classe QObject simplesmente chama o construtor da classe base QObject, que define a variável inicializada como false. A função isInitialized() verifica se o plugin está pronto para uso permitindo que o Qt Designer o identifique. A função createWidget() pode gerar instâncias de um widget customizado. O plugin do widget ficará visível no nome do grupo na seção plugin do widget do Qt Designer. Uma dica de ferramenta e o que é isso? Na caixa do widget, você pode fornecer ajuda para o widget personalizado. A função isContainer() verifica se um widget deve ser usado como um contêiner para outras imagens de widget. Isso evita que o usuário crie widgets nele. Custom Widget WordPress CodeCredit: www.hostpapa.inUm widget personalizado é uma ótima maneira de adicionar funcionalidade ao seu site WordPress. Há algumas coisas a serem lembradas ao adicionar um código de widget personalizado ao seu site. Primeiro, você precisará criar um arquivo chamado “widget.php” no diretório do seu tema. Em seguida, você precisará adicionar o seguinte código ao seu arquivo widget.php: class Custom_Widget extends WP_Widget { function __construct() { parent::__construct( 'custom_widget', __('Custom Widget', 'text_domain'), array ( 'description' => __( 'Um widget personalizado para seu site WordPress.', ' text_domain' ), ) ); } public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); echo $args['before_widget']; if (! empty( $title)) echo $args['before_title'] . $título. $args['after_title']; echo __('Olá, Mundo!', 'text_domain'); echo $args['after_widget']; } public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) { $title = $instance[ 'title' ]; } else { $title = __( 'Novo título', 'text_domain'); } ? > } public function update( $new_instance, $old_instance ) { $instance = array(); $instance['title'] = ( ! empty( $new_instance['title']Wordpress Adicionar widget ao modelo Adicionar um widget a um modelo do WordPress é um processo simples. Você precisará acessar seus arquivos do WordPress através de sua conta de hospedagem e editar o apropriado. Na maioria dos casos, este será o arquivo header.php. Procure o código que controla a área onde você deseja adicionar o widget. Em seguida, copie o código do widget que deseja adicionar e cole-o no local apropriado local no arquivo. Salve o arquivo e envie-o para o seu servidor. Pronto! O widget agora aparecerá no seu site WordPress. No WordPress, há uma tag de modelo chamada the_widget() que permite adicionar um widget diretamente ao seu arquivos de modelo. Um widget pode ser colocado em um arquivo que contém o nome da classe do widget que você deseja usar e onde deseja que ele apareça. Em outras palavras, se você quiser listar comentários recentes, basta escrever isto: $instance para cada widget. Usando funções integradas, você pode adicionar muitos de seus ult WordPress widgets para seus arquivos de modelo em vez de usá-los. Widgets personalizados podem ser inseridos usando o método the_widget() em todo o seu modelo. Widgets personalizados, que podem ser usados ​​em uma plataforma diferente da sua barra lateral, estão disponíveis em muitos plugins.Como faço para adicionar um widget ao meu tema WordPress?Visite as telas de administração do WordPress para ver a página Aparência. Escolha um widget arrastando-o para uma barra lateral específica ou clicando no link Adicionar widget (se o seu tema tiver mais de uma barra lateral, escolha a barra lateral de destino). e insira o arquivo onde seu widget deve aparecer. A segunda etapa é determinar qual widget você deseja usar. Nesta seção, veremos os nomes de classe do widget padrão do WordPress: WP_Widget_Archives. Como criar um widget de imagem personalizado no WordPressPara criar um widget de imagem personalizado no WordPress, você precisará primeiro criar um plugin personalizado ou tema filho. Depois de fazer isso, você pode criar um novo arquivo chamado “image-widget.php” dentro do seu plugin ou tema filho. Dentro deste arquivo, você precisará incluir o seguinte código: class WP_Widget_Custom_Image extends WP_Widget { function __construct() { $widget_ops = array( 'classname' => 'widget_custom_image', 'description' => __( 'Um widget que permite que você para fazer upload de uma imagem personalizada.', 'text_domain' ), ); parent::__construct( 'custom_image', __( 'Custom Image', 'text_domain' ), $widget_ops ); } function widget( $args, $instance) { echo $args['before_widget']; if (! empty( $instance['title']) ) { echo $args['before_title'] . apply_filters( 'widget_title', $instance['title'] ). $args['after_title']; } if (! empty( $instance['image']) ) { echo ”; } echo $args['after_widget']; } function update( $new_instance, $old_instance ) { $instance = $old_instance; $instance['title'] = sanitizar_text_field( $new_instance['title'] ); $instance['image'] = esc_url_raw( $new_instance['image'] ); retornar $ instância; } function form( $instance) { $title = ! empty( $instance['title'] ) ? $instance['title'] : __( 'Imagem personalizada', 'text_domain' ); $imagem = ! empty( $instance['image'] ) ? $instance['imagem'] : ”; ?O plugin Image Widget é um plugin simples que pode ser usado para adicionar widgets de imagem ao seu site usando o gerenciador de mídia WordPress. É comum que os modelos de saída de widget incluam um modelo padrão, mas isso pode ser modificado por arquivos em seu modelo. Na versão 3.2, o filtro sh_template_image_widget_php também foi adicionado, permitindo que você substitua o comportamento padrão do template. Para saber mais sobre a instância específica do widget, você também deve adicionar dois argumentos $args e $instance. Você pode usar isso em um design responsivo se substituir isso. Como posso adicionar um controle deslizante para imagens aleatórias? Sim, você tem a opção de fazer isso. Normalmente, isso é feito diretamente pela exibição da barra lateral do plug-in Image Widget; a exibição da barra lateral deve ser definida para uma página específica. Por favor, deixe-nos saber se você tiver quaisquer perguntas ou comentários nesta página. O Image Widget é um projeto de software de código aberto. Este plugin foi disponibilizado ao público por uma variedade de contribuidores. Se você quiser incluir uma imagem, poderá adicionar um campo e, se desejar incluir um link, poderá adicionar uma classe. Você gastará cerca de 15 minutos fazendo isso, então é um investimento que vale a pena.Como criar um novo widget no WordPress?Arraste o widget para a área de widget relevante ou arraste-o do lado esquerdo da página para a esquerda . Depois de clicar no widget que deseja adicionar, você verá uma lista de maneiras de fazer isso. Para adicionar novos widgets a uma área existente, clique no botão Adicionar widget.