How to Design Footer in Oracle Apex


 
If you want to set all page footer then following this steps...

step-1 : Go to Global Page .

--> Create a new region 

--> Region position footer

--> Set templete : blank with attribute


Step-2 : Footer text :

<div  style="position: fixed;

   left: 16.6%;

   bottom: 0;

   width: 100%;

   background: rgb(200,86,98)!important;

   background: radial-gradient(circle, rgba(200,86,98,1) 0%, rgba(130,20,32,1) 45%, rgba(102,9,19,1) 61%, rgba(84,7,16,1) 77%, rgba(51,2,7,1) 90%) !important;

   color: white;

   padding-left: 400px; 

   font-weight: bold;

   " >

© Developed and Maintained by Rafiqul Islam

</div> 


If you want to set Individual Page footer then following this steps...

Step-1 : Go to Individual Page Inline (copy paste bellow code)

a.circle-tile-footer {

    border: none;

    background: #FFF;

    padding: 7px 16px;

    text-transform: uppercase;

    font-weight: 500;

    font-size: 11px;

    letter-spacing: .5px;

    color: #003e85;

    box-shadow: 0 3px 5px #d4d4d4;

}

.t-Footer {    

    display: none;    

}

.t-Body-content {

    min-height: 100vh;

    display: flex;  

}

.u-BuiltWithAPEX {

    display: none;   

}

.t-Footer-customize, .t-Footer-srMode, .t-Footer-version {

    display: none; 

}

.t-Footer-topButton {

     display: none;   

}


Step-2 : Footer text

<div class="container">

<div class="row">

<div class="col col-12 ">

    <table width="550" align="center">   

      <tbody><tr>

        <td align="center"> 

             &nbsp;&nbsp;

        Developed By :<a href="https://www.linkedin.com/in/rafiqul-islam-nayeem-3a5a1b184/" target="_blank"><font color="#2A5C9B" size="-1" style="font-style:italic;font-weight: bold"> Rafiqul Islam Nayeem </font></a>

             &nbsp;&nbsp;<br>


&nbsp;&nbsp; 

          <span style="color:#2A5C9B">© Copyright 2022, Only Rafiqul Islam Nayeem can all rights reserved.</span>      

             &nbsp;&nbsp; 

        </td>        

      </tr>      

    </tbody></table>

</div>

Post a Comment

Previous Post Next Post