Add an image

9 posts from 2 voices

• Started 10 months ago by viktorlajos
• Latest reply from viktorlajos
• This topic is closed
• This topic is resolved

Tags:

• button
• image

1. 

   viktorlajos
   Member

   Hi,

   I would like to add an image ( button ) in the same height where the page title is just on the opposite side ( align right )

   Is that possible ?

   Posted 10 months ago #
2. 

   Ismael
   Moderator

   Hi,

   What page do you want to add it?

   Regards,
   Ismael

   Posted 10 months ago #
3. 

   viktorlajos
   Member

   Hi,

   To the blog ( front page ) page.

   Regards

   Posted 10 months ago #
4. 

   Ismael
   Moderator

   Hi,

   Open template-blog.php, find this code

   <div class='container template-blog '>

   Below that create a new div or an img tag, put a unique class on it. Float it right on your custom.css. Example.

   <div class="new-image">
      <a href="LINK"><img src="IMG SOURCE" /></a>
   </div>

   On your custom.css, try to add.

   .new-image {
   float: right;
   width: 100px;
   height: 100px;
   }

   Cheers,
   Ismael

   Posted 10 months ago #
5. 

   viktorlajos
   Member

   Hi,

   Thanks it works but now the button is pushing the title ( Blog Latest News) down. ( example: viktorlajos.com )
   How can I bring them in the same line ?

   and ...is there any way I can control the Blog Title Container ( not sure what'ts the name of the div) height without effecting the #top .page-title ?

   Regards

   Posted 10 months ago #
6. 

   Ismael
   Moderator

   Hi viktorlajos,

   Replace this code in your Quick CSS:
   

   .wd-button {
   float: right;
   padding: 0px;
   width: 130px;
   height: 50px;
   }

   with this code:
   

   .wd-button {
   padding: 0px;
   width: 130px;
   height: 50px;
   position: absolute;
   right: 0;
   }

   About the next question, I think you can target this one:
   

   .template-blog .title_container {
   
   }

   Hope this helps. :)

   Cheers,
   Ismael

   Posted 10 months ago #
7. 

   viktorlajos
   Member

   Thank's. It looks good, but somehow it doesn't behave like a link anymore, it's not a clickable... strange. Any suggestion ?

   Posted 10 months ago #
8. 

   Ismael
   Moderator

   Hi viktorlajos,

   I think I have forgotten to include z-index. The complete code should look like this:
   

   .wd-button {
   padding: 0px;
   width: 130px;
   height: 50px;
   position: absolute;
   right: 0;
   z-index: 999;
   }

   Regards,
   Ismael

   Posted 10 months ago #
9. 

   viktorlajos
   Member

   Thanks very much

   Cheers

   Posted 10 months ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.