Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #19389

    is i possible to add icons to socket in replete. i want to add “paypal cards icon” to the socket.




    Hi Shax,

    Just go to footer.php and find this line of code:

    <span class='copyright'>&copy; <?php _e('Copyright','avia_framework'); ?> - <a href='<?php echo home_url('/'); ?>'><?php echo get_bloginfo('name');?></a><?php echo $kriesi_at_backlink; ?></span>

    below it add the html code like(this is just a sample):

    <ul class="payment-links">
    <li><a href=""><img src="images/paypal.png" alt="paypal" /></a></li>
    <li><a href=""><img src="images/someimage.png" alt="paypal" /></a></li>

    Add some css styles on your Quick CSS or custom.css (otherwise the socket will become messy)

    Hope this helps.




    thanks ismael

    i have one more issue, i am using my home page as just a landing page and want to use only one picture or will use a slide show, and will adjust the height of the image or the slideshow, however i want this to be responsive to screen sizes, as if i look at it on the 13” screen it will be perfect means logo at the top, image in the middle and the footer socket at the bottom, but when i change the screen size like use 15 or 17 inch or even f i change the layput of 13inch to full screen the footer socket goes up and it shows the background below the socket.

    is there any way that the socket stays at the bottom and the header stays at the top. regardless of screen size?


    Hi shaxuk,

    There is a minimal amount of content that needs to be present on a page for it to push the footer content down. If its only for one page, you could target that page with css and adjust it for the various screen sizes but that is a bit beyond what we would be able to do for you.

    Just to outline it for you however, you would add this to your custom.css first:

    /* #Media Queries
    ================================================== */

    /* Smaller than standard 960 (devices and browsers) */
    @media only screen and (max-width: 959px) {

    /* Tablet Portrait size to standard 960 (devices and browsers) */
    @media only screen and (min-width: 768px) and (max-width: 959px) {

    /* All Mobile Sizes (devices and browser) */
    @media only screen and (max-width: 767px) {
    #top.home #footer {margin-top: 100px;}

    /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
    @media only screen and (min-width: 480px) and (max-width: 767px) {

    /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
    @media only screen and (max-width: 479px) {

    I’ve added in a sample bit of css that you can use as a model. It targets the home page footer and adds a margin to it for all browser widths smaller than 767 pixels (usually mobile sizes).




    hi Devin

    Thanks for your answer, i think i didnt explain myself correctly, the main content area is not pushing the footer right down to the bottom of the screen. even though i have picture and some text, so for example i have only one line of text is the content area it will show only one line and the footer will be moved up too, the content area is only responding to the amount of lines of text or height of the picture.




    I understood you but there isn’t anything we can do other than what I outlined above. The footer only responds to the content above it unless you set a specific height for that contents container. One line of text takes up about 15-20 pixels of space so you would need to have a lot more in order for the footer to be pushed down.



Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Add icons to socket in replete’ is closed to new replies.