title: Integrating Fancy Box CSS in Grocery Crud
body: <p>I am working on Integrating fancy box .  </p>
  
  <p>Following this link on <a href="http://www.grocerycrud.com/forums/topic/355-answered-how-to-add-fancybox-in-grocery-crud/" rel="nofollow noreferrer">How do add fancy box in grocery crud</a></p>
  
  <p>Although everything is working well, except the fancy box css  does not seems to be linked.
  By default, the list_template.php(assets\grocery_crud\themes\flexigrid\views) file has fancybox css and js linked.</p>
  
  <p>This is the controller code</p>
  
  <pre><code> function customers_management()
  {
          $crud = new grocery_CRUD();
                      $crud-&gt;set_js('assets/grocery_crud/js/jquery-1.8.2.js');
                      $crud-&gt;set_js('assets/grocery_crud/js/custom.js');
          $crud-&gt;set_table('customers');
          $crud-&gt;callback_column('test',array($this,'_callback_test_function'));
          $crud-&gt;display_as('salesRepEmployeeNumber','from Employeer')
               -&gt;display_as('customerName','Name');
  
          $crud-&gt;set_subject('Customer');
          $crud-&gt;set_relation('salesRepEmployeeNumber','employees','lastName');
  
          $output = $crud-&gt;render();
          $this-&gt;_example_output($output);
  }
  </code></pre>
  
  <p>The callback_function </p>
  
  <pre><code>function _callback_test_function($value, $row)
  {
       $attributes = array(
  
          'width'      =&gt; '500',
          'height'     =&gt; '500',
          'scrollbars' =&gt; 'no',
          'status'     =&gt; 'yes',
          'resizable'  =&gt; 'yes',
          'screenx'    =&gt; '0',
          'screeny'    =&gt; '0',
          'class'      =&gt; 'various fancybox.ajax'
  
      );
  
      return anchor_popup('examples/test_content/'.$row-&gt;customerNumber,'Click Here', $attributes);
  
  }
  </code></pre>
  
  <p>The custom js file</p>
  
  <pre><code>$(document).ready(function() {
  $(".various").fancybox(); 
  </code></pre>
  
  <p>});</p>
  
  <p>theme - flexigrid and 
  grocery crud v 1.3.3</p>
  
  <p>Please guide how to solve this problem.Below is the output of the above code<img src="https://i.stack.imgur.com/L7loT.png" alt="enter image description here"></p>