Use of Code Blocks

Add Beutiful Design Theme with Runcb Attribute on Any Tag:-

This will call Tag library on tag and helps to make design easy without remember complex html css layout. Following example create border on h2 tag

<h2 runcb="true" sphp-cb-border="4,|white">Welcome to Our Website</h2>

sphp-cb-*** code block name to call. The code blocks help to reduce the html codes in template and create a nice design of website. You can check file res/Slib/comp/sphpcodeblock.php to see available basic code blocks and then extend this file withing your project with create new file under temp/sphpcodeblock.php You need to create this file to use runcb attribute. This feature is usefull to create and update design of website without changing any code of website.

Examples to use Code Blocks:-

<p runcb="true" sphp-cb-card="header,footer" title="title">This paragraph wraps in card layout of bootstarp</p>

<h2 runcb="true" sphp-cb-border="4,|white" sphp-cb-shadow="" sphp-cb-size="">Apply more then one code blocks</h2>

Run AOS JS Animation:-

it takes 2 parameters type and delay time for extra parameter you can write attributes direcly on tag. Fore more info Check AOS website michalsnik.github.io/aos/

<div runas="p"  runcb="true" sphp-cb-aos="fade-right,|300" >Run AOS JS Animation</div>

Show Counter on website:-

<div runcb="true" sphp-cb-counter="150" sphp-cb-aos="fade-up"></div>

Create A Parallax effect with background:-

<div runcb="true" sphp-cb-parallax="" class="py-4">
        <form id="form1" runat="server">
            <input id="txtname2" runat="server" type="text"  funsetStyler="2" funsetMsgName="Name" funsetRequired="" />
            <textarea id="txa1" runat="server" funsetStyler="1" funsetMsgName="hdjf"></textarea>   
            <select id="slt1" runat="server" funsetOptions="test1,test2" funsetStyler="1" funsetMsgName="Choose"></select>
        </form>
</div>

sphp-cb-parallax="url of image here" or you can add image tag inside div tag. Remember, it will only use the first img tag as background image. All other innerhtml wrap in container div tag. You can experiment and check html output in browser

Jquery UI Animation:-

<div runcb="true" sphp-cb-shadow="" class="mx-4 py-4" sphp-cb-jui="">
Animated text
</div>

arg:- 0-> bounce,fold,puff,pulsate,shake,size,slide
arg: 1-> JS Event to Trigger default mouseenter
arg: 2-> extra options for effect as {} array
arg 3-> timer1 in ms
arg 4-> timer2 in ms
for more info about extra options check website https://api.jqueryui.com/category/effects/

Team List Grid:-

Teamlist create a grid of team member in website with css and all HTML layout with simple tags.

<div runcb="true" sphp-cb-teamlist="" class="" sphp-cb-bggrad="238,174,202,|218,114,202,|linear,|90deg">
    
<div id="list" runat="server" path="libpath/comp/data/Pagination.php" dtable="princategory"  funsetFieldNames="aname,atype,price,des" >
    
    <member runcb="true" sphp-cb-shadow="" class="mx-4 py-4" sphp-cb-jui="">
       <pic src="##{SphpBase::sphp_settings()->slib_res_path}#/temp/default/assets/img/girl1.webp"  />
       <name runas="holder" data-comp="list" dfield="aname">Trudo</name>
       <post>Accountant</post>
       <detail id="det1" runat="server"><span runas="p">##{$this->tempobj->list->getRow("des")}#</span></detail>
    </member>    
    
</div>
</div>

Teamlist use custom tags: pic, name, post, detail. Pagination component generate members list from database and then teamlist convert those list into a good looking design. This example has some extra code like no need to use runas=holder on name tag. this is used to display the value of database field aname from current row in pagination component. For more info check Pagination component.

bggrad:-

Create Gradiant color as Background.

* arg0:- color1 in hex code like #FFFFFF or rgb like 238,174,202
* arg1:- color2 in hex code or rgb
* arg2:- radial or linear
* arg3:- 90deg or circle or any

SartajPHP ( PHP Framework )

Quick Start

Basics

Design UI

Examples

Demo App