code: @Override
  	public void encodeBegin(FacesContext context, UIComponent component) throws IOException {
  	    if (!component.isRendered()) {
  	        return;
  	    }
  		CarouselItem carouselItem = (CarouselItem) component;
  		ResponseWriter rw = context.getResponseWriter();
  		// String clientId = carouselItem.getClientId();
  		
  		// put custom code here
  		// Simple demo widget that simply renders every attribute value
  		rw.startElement("div", carouselItem);
  		Tooltip.generateTooltip(context, carouselItem, rw);
  
  		rw.writeAttribute("style", carouselItem.getStyle(), "style");
  	    String styleClass = carouselItem.getStyleClass();
  	    if (null == styleClass)
  	    	styleClass="item";
  	    else
  	    	styleClass = "item " + styleClass;
  	    if (carouselItem.isActive()) {
  	    	styleClass += " active";
  	    }
  		rw.writeAttribute("class", styleClass, "class");
  		
  	    rw.writeAttribute("id", carouselItem.getId(), "id");
  	    Tooltip.activateTooltips(context, carouselItem);
  	    AJAXRenderer.generateBootsFacesAJAXAndJavaScript(context, carouselItem, rw, false);
  	}
docs: This methods generates the HTML code of the current b:carouselItem.
  <code>encodeBegin</code> generates the start of the component. After the, the JSF framework calls <code>encodeChildren()</code>
  to generate the HTML code between the beginning and the end of the component. For instance, in the case of a panel component
  the content of the panel is generated by <code>encodeChildren()</code>. After that, <code>encodeEnd()</code> is called
  to generate the rest of the HTML code.
  @param context the FacesContext.
  @param component the current b:carouselItem.
  @throws IOException thrown if something goes wrong when writing the HTML code.