Support » Plugin: Ditty News Ticker » Width not setting correctly (as widget)

  • Resolved photoMaldives


    Hi again, metaphorcreations

    I’m liking your plugin a lot – the scrolling action is lovely & smooth. 🙂

    But I have a problem – hoping you can help. I’m using the widget functionality to add the Ticker into my footer, but the width is not setting correctly – it shows up as just a few pixels wide, with the text scrolling past as if in a very narrow window.

    I’ve played with the plugin Dimensions and Padding settings, but his has not helped. I also applied custom CSS to ‘.mtphr-dnt-tick-container’ to set the width – this worked, but then all the text was displayed at once, and overlaid on itself.

    Checking ‘Display Ticker Title’ increases the width from a few pixels, to the width of the title – an improvement, but I would like it full width if possible.

    Adding the shortcode to a page – displays fine at full width.

    Hope all that makes sense, and thanks in advance for any help. 🙂

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author metaphorcreations


    Make sure the div that the ticker gets put in has a set width. The actual ticker container width is set to 100%, so if the containing div (or other element) is relying on the contents to create a width you will run into that issue. If you provide a link I can check it out and give you a more specific answer.

    Hi metaphorcreations – thanks again for your prompt reply.

    I’ve been working on this, and am now very happy with the way it looks. For the record, this is what I needed to do –

    Add line to STYLE.CSS
    .mtphr-dnt-tick-container {width: 900px !important;}
    Maybe this could be added as an option in the plugin front end ? Either 100%, or set a value in px.

    And these are my settings :

    Ticker Mode : Scroll
    Direction : Left
    Tick Dimensions : Width (0) Height (20) [1]
    Scroller Padding : Padding (0) Margin (0) [2]
    Scroll Speed : 5
    Tick Spacing : 100

    [1] – the auto-height did not quite work for me, so this was required to give enough height to display font descenders (eg: ‘g’)
    [2] – suggestion – these 2 options appeared to add spacing to both TOP and BOTTOM, which wasn’t what I wanted.

    Plugin Author metaphorcreations


    Glad you found a solution that works for you. I’ll probably just add some info into the help docs or a FAQ page that mentions this scenario, as most of the time a surrounding div will have some sort of a width set to it.

    I would suggest adding your custom CSS into the Ditty News Ticker settings page within the custom css field. If you modified the actual stylesheet for the plugin, your customization will be overwritten when the plugin updates. If you setup all your custom CSS within the Custom Styles field those will always stay unless you change them.

    There may be other CSS rules you want to add for the ticker to fit into your site as well, as by default there are very limited styles applied.

    Thanks for your suggestions, metaphorcreations – and yes, I added to my child theme css file – I just prefer everything to be in 1 place if possible. Having the custom css page is still quite a rare (albeit very welcome) plugin feature, so if I need to revisit in 6 months time I might find it a bit confusing !

    I’ve just submitted a review – keep up the great work, and best of luck with this and future plugins.

    Plugin Author metaphorcreations


    I did actually add a setting to set the width after thinking about it a little more… It was a good idea and since it wasn’t too hard to add in, I figured I would.

    If you update to the latest version you’ll see a setting in the Global Options in your ticker to set the width (only in pixels).

    yep – nice one – works a treat. 🙂

    Plugin Author metaphorcreations



Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Width not setting correctly (as widget)’ is closed to new replies.