Jump to content

Archived

This topic is now archived and is closed to further replies.

LightningBoxer

Edit caption style in DMS

Recommended Posts

LightningBoxer+    0
LightningBoxer

How do I edit the CSS for captions in DMS? I want the words to align left instead of center, which is the WordPress default.

Share this post


Link to post
Share on other sites
rmaxsg    7
rmaxsg

no sure what you refer to word alignment. I will guess in this case textbox..   By default should be text align left.

 

you go over fault

 

1. Add Section

 

2. Drop your Textbox

 

3 at right sidebar you will see a text alignment

 

Please refer the image below.

http://cl.ly/image/310g2N300p1H

Share this post


Link to post
Share on other sites
CoachJo    3
CoachJo

Hi Newbie, 

 

I don't know how to make it align left but if you want the type to be smaller, put the caption in the Text and Embed box instead of in the Title box.

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi,

 

Can you explain in greater detail what you mean by caption please.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
LightningBoxer+    0
LightningBoxer

Thanks for everyone's interest and generosity. I'll try to better explain my question, using this page as an example: http://www.in-terms-of.com/right-here-right-now/

 

The captions for the three images, which were written while I was composing the post and inserting photos, are centered underneath their respective images. I would like the captions to align to the left side and do this globally, so that every caption throughout the website--and every future caption--is aligned to the left side.

 

In other WordPress themes, it's possible to edit the CSS, but PageLines DMS discourages changes to the CSS via WordPress because updates to DMS will overwrite the WordPress CSS. I have not yet found the place in DMS to make a change of this kind.

Share this post


Link to post
Share on other sites
CoachJo    3
CoachJo

Hi Ninja,

 

The picture caption can be added via the media box options rather than by inserting a text box.

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

OK, to customize the caption you can use custom CSS. For this, I highly recommend you use Google Chrome web dev tools (it's the best imo) and inspect the element. You should find a div with a class called wp-caption, you can use this class to add custom CSS.

 

For example:

 

#site .wp-caption {
background-color: #F00;
color: #FFF;
}
 
This will change the captions background color to red and the text to white, you're free to change the colors and expand on the code.
 
If you're unsure how to use Chromes web dev tools, I recommend signing up to Code School its free, who have a free introduction to Web Dev tools, the course should make  you a Chromes web dev tools ninja in no time.
 

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
LightningBoxer+    0
LightningBoxer

CoachJo, are you suggesting that I abandon the option to write my captions while editing the image in WordPress (as I'm creating and formating a blog post or page), and instead to add a DMS design element?

 

Ninja, I understand that I must add a <p style="text-align: left;"> to the CSS for captions, which I've identified as <p class="wp-caption-text">. Thanks.

Share this post


Link to post
Share on other sites
LightningBoxer+    0
LightningBoxer

I don't quite understand how to add code to the Custom LESS/CSS. I've placed the following in the box for Custom Code:

 

#site media="all" .wp-caption .wp-caption-text {
text-align: left;
}
 

but I do not see the proper results. In fact, browsers are giving me a compile error.

 

Share this post


Link to post
Share on other sites

  • Similar Content

    • batman
      By batman
      I have the following problem with DMS 1.1.1 and WP 3.7   If.....I add an image to a post   http://screencast.com/t/V66tvDUA   Then I added a Caption   http://screencast.com/t/lzzC5ZSXhx   Everything looks perfect   http://screencast.com/t/U229V8Hm4Y   If I pass the editor and return to Visual Text , or I publish and edit   http://screencast.com/t/gBYex63H   I do not see the image in the Visual   http://screencast.com/t/LgYPsYbgaG   I do not I have that problem with the Twenty Thirteen .   This is the link http://natfoto.com.ar and it happens in all other sites .   I have no plugin enabled.   This is my Debug Info WordPress Version 3.7   multisite Enabled not   Current Role Administrator   Path Framework / home/content/62/9163462/html/natfoto/wp-content/themes/dms   Framework URI http://natfoto.com.ar/wp-content/themes/dms   Framework Version 1.1.1   PHP Version 5.3   Child theme Yes / home/content/62/9163462/html/natfoto/wp-content/themes/nicks-base-theme-master http://natfoto.com.ar/wp-content/themes/nicks-base-theme-master   PHP memory 256   Mysql version 5.0.96 -log   PHP type Cgi - fcgi   PHP User Posix functions are disabled on this host !   OS Linux   Licence OK ...............................   Installed Plugins dms-plugin-pro/dms-plugin-pro.php   Thanks in advance Carlos
    • progressive01
      By progressive01
      Hi Nick,
       
      Love Gridly - one thing I have found is if we put a caption on some but not all images, on the blank ones a light grey box still appears where the caption should be - this is happening in Safari and in the ipad for me. - Screenshot attached.
       
      Again as others have said, would love the caption to be available in lightbox also if possible one day 
       
      Many thanks in advance

    • johndb
      By johndb
      I'm making use of the Image Carousel sortcodes inside a Banner.
       
      I want to be able to remove the carousel caption box from one slide only.
       
      After searching the forum, I found this post http://www.pagelines.com/forum/topic/21768-any-adjustments-available-to-image-carousel-shortcode/?p=126473
      which says deleting the Title and Caption automatically removes the caption box background (the semi-tranparent dark box at the bottom of the slide)
       
      I have tried this method on the slide I'm working on, and it leaves a blank caption box. I then tried removing all Titles and Captions from all shortcodes on all slides, but the box still remians. I have also tried entering the shortcode, without Titles and Captions, into a regular WP page incase it was a conflict with the Banner, but the caption box remains.
       
      Since adding custom CSS will no doubt remove the caption box from the whole site (or at least all slide on the Image Carousel I'm working on), is there some piece to the shortcode I am missing?
       
      I have  attached the shortcode I'm using to this post, and a screen cap of the Image Carousel on the slide I'm working on. This should explain why I would want to remove it.
      [pl_carousel name="NAS-Carousel"] [pl_carouselimage first="yes" imageurl="/wp-content/uploads/NAS-logo4-300x200.png" ] [/pl_carouselimage][pl_carouselimage imageurl="/wp-content/uploads/NAS-box1.jpg"] [/pl_carouselimage] [pl_carouselimage imageurl="/wp-content/uploads/NAS-box2.jpg"] [/pl_carouselimage] [/pl_carousel]
×