• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

MMM-NewsFeedTicker

Scheduled Pinned Locked Moved Utilities
94 Posts 15 Posters 67.9k Views 14 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • C Offline
    Cr4z33
    last edited by Cr4z33 Oct 26, 2018, 2:29 PM Oct 26, 2018, 2:24 PM

    @justjim1220 what should i put into

    defaultLogo : ""
    

    if I would like i.e to use a different logo?

    Also what is the max. image size accepted (in MegaBytes and pixels) please? :)
    Can we load various RSS into rotation into the same line?

    1 Reply Last reply Reply Quote 0
    • E Offline
      electros Project Sponsor @justjim1220
      last edited by Oct 26, 2018, 5:24 PM

      @justjim1220
      Hi, this is what I add to custom.css

      MMM-NewsFeedTicker {
          height: 40px;
          background-color: black;
          margin-left: 20%;
      }
      .MMM-NewsFeedTicker .tickerbody {
          position: absolute;
          bottom: 7px;
        
      }
      .MMM-NewsFeedTicker .image {
        position: absolute;
        margin-left: 20%;
        bottom: 7px;
        height: 40px;
      }  
      

      but i find what the problem is:
      When i change the color of background to black just i hide background but that is not in same line like writing, is upper for that reason the writing is not hidden when go over the buttons. i change back the background to maroon and you can see the difference0_1540574544136_4.png

      J 1 Reply Last reply Oct 26, 2018, 7:44 PM Reply Quote 0
      • J Offline
        justjim1220 Module Developer @electros
        last edited by Oct 26, 2018, 7:44 PM

        @electros

        ok,

        change background-color to background: none;
        and,
        change position back to relative under the image section

        should work for you…
        0_1540583047363_Screenshot (411).png

        "Life's Too Short To Dance With Ugly People"
        Jim Hallock - 1995

        E C 2 Replies Last reply Oct 26, 2018, 8:19 PM Reply Quote 0
        • E Offline
          electros Project Sponsor @justjim1220
          last edited by Oct 26, 2018, 8:19 PM

          @justjim1220
          I tried but it does not work. Now in custom.css it looks like this:

          .MMM-NewsFeedTicker {
              height: 40px;
              background-color: none;
              margin-left: 20%;
          }
          .MMM-NewsFeedTicker .tickerbody {
              position: absolute;
              bottom: 7px;
            
          }
          .MMM-NewsFeedTicker .image {
            position: relative;
            margin-left: 20%;
            bottom: 7px;
            height: 40px;
          }  
          

          And the screen is like that:
          0_1540585163271_5.png

          1 Reply Last reply Reply Quote 0
          • E Offline
            electros Project Sponsor
            last edited by Oct 26, 2018, 8:49 PM

            The problem is just to move that red line to bottom under the writing line and after that everything it’s fine. Thanks

            J 2 Replies Last reply Oct 26, 2018, 9:25 PM Reply Quote 0
            • J Offline
              justjim1220 Module Developer @electros
              last edited by Oct 26, 2018, 9:25 PM

              @electros

              Apologies!

              Looks like I did tell you wrong about the position…
              Here is the css that makes it work for me, try them and let me know…

              @keyframes marquee {
                  0% {left: 100%;}
                  100% {left: -100%;}
              }
              
              .MMM-NewsFeedTicker {
                  width: 100%;
                  height: 100px;
                  line-height: 100%;
                  overflow: hidden;
                  background: none;
                  margin-left: 20%;
              }
              
              .MMM-NewsFeedTicker .tickerbody {
                  position: relative;
                  bottom: 0;
                  left: 0;
                  vertical-align: middle;
                  white-space: nowrap;
                  text-align: left;
                  animation: marquee 31s linear;
                }
              
              .MMM-NewsFeedTicker .headline {
                  padding-top: 15px;
                  margin: 0 auto;
                  white-space: nowrap;
              }
              
              .MMM-NewsFeedTicker .image {
                position: absolute;
                display: inline-block;
                vertical-align: middle;
                bottom: 10;
                margin-left: 0;
                height: 100px;
                z-index: 10;
                background-color: #FFF;
              }
              

              "Life's Too Short To Dance With Ugly People"
              Jim Hallock - 1995

              1 Reply Last reply Reply Quote 0
              • J Offline
                justjim1220 Module Developer @electros
                last edited by Oct 26, 2018, 9:37 PM

                @electros

                what is the name of the module for the buttons?

                "Life's Too Short To Dance With Ugly People"
                Jim Hallock - 1995

                E 1 Reply Last reply Oct 26, 2018, 10:02 PM Reply Quote 0
                • E Offline
                  electros Project Sponsor @justjim1220
                  last edited by Oct 26, 2018, 10:02 PM

                  @justjim1220
                  Sorry but it’s not working. I copied the css you put above in MMM-NewsFeedTicker.css but it still does not work. Now it looks like that
                  0_1540591080827_6.png
                  Buttons are created with the module “MMM-TouchNavigation”

                  J 2 Replies Last reply Oct 26, 2018, 10:50 PM Reply Quote 0
                  • J Offline
                    justjim1220 Module Developer @electros
                    last edited by Oct 26, 2018, 10:50 PM

                    @electros

                    do you still have the entries you put into the custom.css?

                    "Life's Too Short To Dance With Ugly People"
                    Jim Hallock - 1995

                    1 Reply Last reply Reply Quote 0
                    • J Offline
                      justjim1220 Module Developer @electros
                      last edited by Oct 26, 2018, 11:14 PM

                      @electros

                      OK, you need to add the following to your custom.css file:

                      .navigation-menu {
                          display: flex;
                          align-items: stretch;
                          position: absolute;
                      }
                      

                      With the code I posted and this addition to the custom.css file, I was able to get this…
                      0_1540595500237_Screenshot (412).png
                      0_1540595512137_Screenshot (413).png 0_1540595520896_Screenshot (414).png

                      If you added any NewsFeedTicker code to your custom.css file, you need to remove it.

                      If you want the background color back to maroon, change the background: none; to background-color: maroon;

                      "Life's Too Short To Dance With Ugly People"
                      Jim Hallock - 1995

                      E 1 Reply Last reply Oct 27, 2018, 11:36 AM Reply Quote 0
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 9
                      • 10
                      • 1 / 10
                      1 / 10
                      • First post
                        10/94
                        Last post
                      Enjoying MagicMirror? Please consider a donation!
                      MagicMirror created by Michael Teeuw.
                      Forum managed by Sam, technical setup by Karsten.
                      This forum is using NodeBB as its core | Contributors
                      Contact | Privacy Policy