Criando um Widget no Ning

De WikiPapagallis

Conteúdo

Pré-requisitos

  • Você precisará obter o código fonte de sua rede, enviando um e-mail para o pessoal do Ning
    Sem isto, não é possível criar a pasta "widgets" na sua rede

Como fazer

Você precisará criar inicialmente 3 pastas para seu novo widget:

  • /instances/{widgetname} (instance information for the widget)
  • /widgets/{widgetname} (the main PHP code for the widget)
  • /xn_resources/widgets/{widgetname} (javascript, css and graphics files for the widget)

Primeiramente, crie uma nova pasta dentro de /widgets com o nome do seu widget. Neste exemplo, criaremos uma pasta/widget chamado "dishwasher".

Vamos criar alguns subdiretórios e arquivos dentro de /widgets/dishwasher/:

  • /widgets/dishwasher/
  • /widgets/dishwasher/controllers/
  • /widgets/dishwasher/controllers/IndexController.php
  • /widgets/dishwasher/templates/
  • /widgets/dishwasher/templates/index/
  • /widgets/dishwasher/templates/index/index.php (aqui adicionaremos os divs, etc)

Vamos colocar o código abaixo dentro do arquivo IndexController.php:

<?php

class Dishwasher_IndexController extends W_Controller {
    
    protected function _before() {
        // any code placed her will run prior to any request
    }    

    public function action_index() {
        $this->dishwasherStatus = 'O Dishwasher (Lava-louças :) está vazio :).';
    }

}
?>


Dentro de /widgets/dishwasher/templates/index/index.php, vamos colocar o código abaixo:

<%= $this->dishwasherStatus %>


Tudo que precisamos fazer para testar este novo widget é instanciar o 'dishwasher' no diretório 'instances'. Crie então um diretório dentro de /instances chamado dishwasher, e crie um arquivo dentro chamado widget-configuration.xml. Vai ficar assim:

<?xml version="1.0"?>
<widget id="99" root="dishwasher">
    <name>Dishwasher</name>
    <config>
        <version type="string" checkState="true">0.1</version>
        <title>Dishwasher</title>
        <displayName>Dishwasher</displayName>
        <description>An example widget.</description>
        <isMozzle type="number">1</isMozzle>
        <isFirstOrderFeature type="number">1</isFirstOrderFeature>
        <isPermanent type="number">0</isPermanent>
        <isEnabledDefault type="number">1</isEnabledDefault>
    </config>
    <privateConfig>
        <isEnabled/>
    </privateConfig>
</widget>

Para testar, visite seu site e clique n a Aba "Dishwasher" que deverá estar aparecendo em sua rede, ou visite o endereço http://SUAREDE.ning.com/dishwasher . Você deverá ver uma página em branco com o texto "O Dishwasher (Lava-louças :) está vazio :)."

Criando Templates para seu widget

Para utilizar o layout da sua rede, utilize o seguinte modelo:

<?php
xg_header(W_Cache::current('W_Widget')->dir,'Título da Página');
?>

<div id="xg_body">
  <div class="xg_colgroup">
    <div class="xg_3col first-child">
      <%= $this->renderPartial('fragment_navigation', '_shared') %>
      <div class="xg_module">
        <h1>Título da Página</h1>
        <!-- AQUI VAI SEU CONTEÚDO -->
        <%= $this->dishwasherStatus %>
      </div><!--/xg_colgroup-->
    </div><!--/xg_3col-->
    <div class="xg_1col last-child">
      <?php xg_sidebar($this); ?>
    </div><!--/xg_col-->
  </div><!--/xg_colgroup-->
</div><!--/#xg_body-->
<?php XG_App::ningLoaderRequire('xg.index.nls.' . XG_LOCALE); ?>
<?php xg_footer(); ?>

Adicionando Dados

xn:adContent

Consultando Dados

xn:query

Ferramentas pessoais
Colaboradores