Sign in to follow this  
Followers 0

DMS 2 Simple method for inserting a small image

4 posts in this topic

Hi everyone,


I'm looking for a way to insert some small linked images into my site and am not sure what the best route is to do it.  


The site is


If you visit the site right now, you'll see in the top nav there is a link for "User Login".  The client wants this to be a button. :) I think they want it to be in the top right corner above the menu.  I think they want a small button - not a great big one like is on the masthead.  I think there is a way to do this with the btn class, but I'm not that sharp at CSS (my lack of coding skills is what drew me to Pagelines DMS).


Also, in the bottom right corner you see the text "Powered by 340B Direct".  They also want this to be a small logo-like image.  So, in this case, I have to make it an image file, possibly linked.


I've looked through all the section options and additional add-ons in the Pagelines shop and can't really see anything that will make it easy to pop a small image in somewhere.  Any creative ideas?




Share this post

Link to post
Share on other sites

HI, ryanchristopherson


You can get the Id for the menu item and actually change the menu item to look like a button like in the screenshot below {


add your css here



Of course you can be more creative than just red.


and for the logo at the bottom of the page you can use this  bit of code


<a href="URL HERE" target="_blank"><img src="IMAGE URL"></a>
1 person likes this

Share this post

Link to post
Share on other sites

Ha - I over-thought it and was looking for an element to add the image, when I could just pop in some simple HTML.  


Thanks for the button CSS for the menu.  I increased the size of the navi menu, so it creates a large button effect (like a lot of space above and below the text).  I may need to figure out how to slim up the area around the menu items with some padding before this looks right.  Or just talk them into leaving it as a regular menu option...


Thanks for your help!


Share this post

Link to post
Share on other sites

Is this topic now resolved? 

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
Followers 0

  • Similar Content

    • Edge-to-edge images
      By janpeeters+
      Hi, I have a container with on the left a 6 column image section and on the right a six column text section. I'm not succeeding in getting a edge-to-edge image on the left. Even with padding set to 0, there remains a white gap under and on the left of the image. So I'm researching if I'm overlooking something, if I've found something that could be improved in PL5 or if this is 'by design'?
      I've set site lay-out in settings to 100%. I've set pl-framework-base to 'full width'/'unwrapped'. (sidenote: in the end I want to have this 'read width' but for testing purposes I set it to full width. This might ask for an override function in the editor so people can always choose to full-width a section although other content is read width.) The images beneath show the settings and lay-out. 
      I've set all padding on the container to 0, but there remains a gap underneath the image and on the left. 
      I've done the same for the padding on the image.

      I've inspected this with Chrome Dev tools and it shows the following:

      I could create custom CSS to remove these spaces but for PL5 to be even more flexibleI I would think that being able to have edge-to-edge images without too much hassle would be a great feature. You see this a lot in recent webdesign. But I might be overlooking something and it is already possible. 
      I've done some testing with the Window Height setting. I think it would be great if images could fill their container edge-to-edge too with this setting active.
      I've tried to make the image taller but then the aspect ratio changes. A locked aspect ratio function would be great for this. With responsive designs images get cropped all the time so for me cropping would not be a problem. Keeping it's aspect ratio locked automatically or as a setting would be nice. I guess most designers wouldn't want it unlocked. 

      That's it, a whole visual story. I hope that it's clear what I'm saying if not let me know and I'll try to clarify. 
      Thanks, Jan
      (by the way, the current forum software you're using is really the best you've had. It works so easily, brilliant)
      There seems to pop an image at the bottom that I didn't put here, forget about the image below, it's already above.

    • REVSlider Issue
      By jermainestegall
      Hello Danny,
      I've been experiencing problems this past week trying to add images to theREV SLIDER section of my wordpress site.  Once I upload an image, it's not visible within the DMS 2 template.  I can't see images in the media gallery or in the slider even when I refresh or clear the cache etc.  Is there something that's disabled now that was only available for 1 year?  I paid for the template.  Also, if I re-install the DMS 2 template will that help reset anything that may have become corrupt?
      Is this a function that only works for a limited time (1 year?)
      thanks again
      Jermaine Stegall
    • Editing the feature image thumbs on the blog roll
      By jDub
      I'd like to edit where the featured image "thumb" shows up on the blog roll.  I'd actually like to remove it from the blog article it's self and only have it show up on the blog roll aligned left with the text to the right of it.
      I'm fine with creating a child theme for this task, but am not sure which file would need adjusting (besides the css) to achieve this.  I'm hoping you can help.
      Thank you in advance.
    • Images in templates help
      By hrachovec
      I'm trying to achieve a simple design but it's proving difficult. I'm making a portfolio site where I have a piece of artwork appearing on top, with the WP post loop underneath. 
      Attached is the basic layout I'm trying to achieve.
      Each of these work samples are Posts in my Wordpress. The issue I have is that when I add a large image to Post A then go Post B, that Post A image appears on Post B. Guessing this was a template issue, I tried to create a unique template for each Post (which seems overly complicated but I couldn't think of how else to do this). But that approach doesn't fix the issue either. 
      When I'm on Post B and insert its unique image into the Media Box up top, if I go back to the Post A, that Post B image is up top where it shouldn't be. 
      I've tried unlocking templates so Post A and B are using their own template and are unlocked but they still seem to be connected because I get that image issue mentioned above. 
      I've also noticed that if I assign the Post A template to Post A, then if I go over to B, it's template has switch to A. Grr! 
      Post A:
      Post B:
      Confusing, I know. Any ideas of how to do this more easily?
      Thanks in advance, Russell
    • change mediabox resizability to better align with resizing of quickslider images
      By margie
      Hi All-
      I have a quickslider at the top of my page with mediaboxes below.  When I resize the screen, both images reduce in size to a certain point.  When the screen looks to be about the size of an iPad, the mediabox images revert to a larger size as they stack on top of one another, while the quickslider image continues to decrease in size.  Is there a way to make the mediabox images shrink with the same aspect ratio as the quickslider image?  Ideally, I would like all images to continue to get smaller as the device gets smaller.
      Thanks so much for your assistance.