146 comments found.
Our website is crashing and through our debugging efforts we’ve found the following line in the crash logs:
[2212:3452:0706/104538:INFO: CONSOLE ] “Uncaught TypeError: Cannot create property ‘undefined’ on string ’’”, source: http://new.ironbellystudios.com/wp-content/plugins/dzs-zoomtimeline/assets/zoomtimeline/zoomtimeline.js?ver=4.4.4 (166)
So I wanted to write you and ask for your help on this as it seems to be making our website very instable, resulting in 6 out of 7 page loads crashing Chrome 
Thanks in advance
Send me a pm via my profile
I will send you latest update
It might resolve it
Thanks!
Hello, working on clients site using slider variation and noticed that the bottom featured images slider does not work on mobile, I checked your demo for the slider variation version and the same thing is happening there on mobile. Any way to fix this?
Thanks!
Hello
We’ll fix first thing tomorrow
Thanks!
Ok fixed – https://www.youtube.com/watch?v=ClAArIhdfo0&feature=youtu.be
Thanks!
Thank you so much, and loving the plugin!
Hey just noticed that the date does not change with that fix while scrolling through the images, only with the text, this is on mobile display, can this be fixed?
We would also like to somehow disable the date transition on that sliding bar, how it transitions almost like it is counting through numbers between each date transition, can this be adjusted for a smooth transition or can you give me some guidance on how to do this?
Thank you!
Hello
You don’t like the custom code transition between the dates on the scrollbar ?
You can go to Plugins > Editor
Replace the contents of zoomtimeline.js with the contents from zoomtimeline.dev.js
on line 1921 replace
if(arg>-1){
//console.warn( cthis.find('.scrollbarx .the-year').eq(0), cthis.find('.hexa-inshow').eq(arg));
shuffleText(cthis.find('.scrollbarx .the-year').eq(0), cthis.find('.hexa-inshow').eq(arg).text())
}
with
if(arg>-1){
//console.warn( cthis.find('.scrollbarx .the-year').eq(0), cthis.find('.hexa-inshow').eq(arg));
cthis.find('.scrollbarx .the-year').text(cthis.find('.hexa-inshow').eq(arg).text())
}
Thanks
hi. using the yearlist mode, with description length 500. The description length seems to count letters, and the last word of the description is cut. Can we change to count words instead of letters ?
What is the strip shortcodes/html ? Thanks
Hello
Not at the moment but maybe in the future
Strip html removes html tags and strip shortcodes removes shortcodes
Thanks!
Hello I’ve installed the plugin with no issues, inserted it with VC but when the page displays the timeline doesn’t show. After a page refresh within the browser, it finally shows up. Checking the issue using developer tools I get the following 2 errors: Failed to parse SourceMap: http://xxx/wp-content/plugins/dzs-zoomtimeline/assets/zoomtimeline/zoomtimeline.css.map and Failed to parse SourceMap: http://xxx/wp-content/plugins/dzs-zoomtimeline/assets/zoombox/zoombox.css.map (please note: xxx refers to the correct address and I’ve checked for the files using my ftp software)
Why do I get this error? Is it the reason for the timeline not showing without a page refresh?
Best regards
Hello
Can you show me the real link ?
If it’s not showing without refresh, then your template might be ajax enabled and you should ask the theme developer on how to load 3rd party plugins
Those are not errors they are just warnings and should have 0 effect on the timeline
Thanks!
Hi We don’t have a Read More link even though our articles are longer… http://www.techcaredev.com/battea/about-battea/insights/class-action-news/ Do we need something in the shortcode to display the read more link?
HI Also can we limit the number of posts to display?
And in black and white mode can we resize the photos so they are smaller and fit the column width with the description next to the photo? Right now the photos are staying large in a thin column so that the description is falling below or above the photo. Thanks!
I just figured out that if we have an excerpt specified there is no read more link. We want a read more link on all items, even if there is an excerpt. Can that be done? Thank you!
Hello
You can limit the number of posts to display with wpqargs=”posts_per_page=3”
ie.
[zoomtimeline mode="mode-yearslist" post_type="timeline_items" cat="all" date_format="default" skin="skin-light" desc_length="100" mode_slider_variation_content_position="bottom" order="desc" order_by="date" strip_shortcodes="on" strip_html="on" wpqargs="posts_per_page=3"]
I’m not sure why would the READ MORE link not show along the SHORTER content
But it’s very easy to insert the link in a excerpt via {readmore}
ie. do this in a item excerpt
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo <strong>hmm</strong>.
</p>
<p>{readmore}</p>
Thanks!
HI thanks for the wpqargs=”posts_per_page=3” but that is not working. There are two equal signs there looks like something is not right but in any case this is what I have and ALL posts are showing:
[zoomtimeline mode=”mode-blackwhite” post_type=”post” cat=”4” date_format=”default” skin=”skin-dark” desc_length=”100” strip_shortcodes=”off” strip_html=”on” wpqargs=”posts_per_page=2”]
in black and white mode can we resize the photos so they are smaller and fit the column width with the description next to the photo? Right now the photos are staying large in a thin column so that the description is falling below or above the photo. Thanks!
Hello
You can go to ZoomTimeline and in Extra CSS write
body .zoomtimeline.mode-blackwhite .ztm-item .image-con{ width: 25%; } .zoomtimeline.mode-blackwhite .ztm-item .ztm-content{ width: 75%; }
Cheers
I’ve installed this plugin and it seems to be working but I cannot get it to display the slider to move between times. These are the parameters I’m using: zoomtimeline mode=”mode-slider-variation” post_type=”post” cat=”10” date_format=”d F Y” skin=”skin-light” desc_length=”100” mode_slider_variation_content_position=”top” strip_shortcodes=”on” strip_html=”on” And here it is: http://sealy-smith.9wildmuses.com/timeline/ And I need it to look like this example: http://codecanyon.net/item/zoomtimeline-wordpress-ultimate-timeline-pack/full_screen_preview/14406785 Thanks!
So I’ve made some modifications and it is “better” but still doesn’t give me the slider and the links to the timeline items doesn’t work. Here are the modified parameters: [zoomtimeline mode=”mode-slider-variation” post_type=”timeline_items” cat=”all” date_format=”d F Y” skin=”skin-dark” desc_length=”100” mode_slider_variation_content_position=”top” strip_shortcodes=”on” strip_html=”on”]
Hi
It’s a conflict with theme
Go to ZoomTimeline > Settings and In Extra CSS enter
.zoomtimeline.mode-slider-variation .inner > img{ max-width: none!important; }
Thanks! It’s MUCH better but the dates on the timeline (at least at the beginning) aren’t displaying properly.
1. Please make sure you have featured images for the first 3 posts. This mode only works mode if there are images attached to the timeline items
2. Add this to Extra CSS.zoomtimeline .scroller-con.skin_luna .scrollbarx .the-year{ white-space: nowrap; }
Thanks!
I’m still having issues of it not displaying as it does in the example. I’ve responded to your previous emails a couple of times but have not heard back. Here is where I’m still having issues: 1—If it is view on a wide screen, the dates continue off the screen. 2—Some of the “read more” links are on the next line down while some continue on the same line, cutting off text. 3—The date sometimes renders badly.
Hi
I sent you update on your mail
Cheers
Radu
I think we have most of the little glitches fixed but there is still one problem. If a timeline event does not have a featured image, it doesn’t show. Example, I have an entry for 1924 and the date of the post is 1924 but if you look at the timeline, there is no 1924.
Yes, on mode slider variation ALL posts must have a featured image. It’s how it calculates the scroller years position and such
Thanks!
How do you add the content? Dates descriptions etc for some reason it is not showing for me
Thanks
Hello
From Wordpress Dashboard , you can edit items via Timeline Items and add content there
Thanks!
Hello guys,
You can use
.zoomtimeline.mode-yearslist.first-item-active .details-container .diamond-arrow-left, .zoomtimeline.mode-yearslist.last-item-active .details-container .diamond-arrow-right{
display:none;
}
To hide the prev / next arrows for the timeline do not loop
Thanks
Radu
What are the recommended sizes for timeline feature images ? What is the recommended number description length to use? Every timeline item consists of 2-3 pages, how to link to the whole document ? ps: The yearlist option works fine, others do not.
Hello
What mode are you using ?
Thanks!
Using Yearlist mode
Hello
You can use 300×200 images..
If desc_length is smaller then the timeline item content it will append a read more link that when clicked will go to that portfolio item.
[zoomtimeline mode="mode-yearslist" post_type="timeline_items" cat="all" date_format="default" skin="skin-light" desc_length="50" mode_slider_variation_content_position="top" order="desc" order_by="date" strip_shortcodes="on" strip_html="off"]
Thanks!
Thanks!
I have some questions and problems with the plug-in:
1) Is there any way to reverse the timeline to display items in descending order?
2) How do I filter using the cat=”” shortcode parameter? I’ve tried entering in the slugs for project categories but that doesn’t seem to work. I’m unclear on what value other than “all” would work.
3) I’m using the Divi theme with this plugin. If I use the Divi Builder to create project page content, the shortcodes used by the Divi Builder seem to get misprocessed by the ZoomTimeline plugin. The use of the strip_shortcodes=”” and strip_html=”” are not well documented, so I’m unsure how they be of use to me in potentially addressing this issue.
So, that’s really two questions – a) is there a way to address the use of Divi Builder and b) could you provide better documentation on those two shortcode parameters.
4) I’m unable to get the Masonry mode to work (I get a lot of white space rendered in the browser) using this: [zoomtimeline mode=”mode-masonry” post_type=”project” cat=”all” date_format=”Y” skin=”skin-light” desc_length=”100” mode_slider_variation_content_position=”bottom” strip_shortcodes=”on” strip_html=”on”]
5) Do you have documentation on the CSS selectors that can be used to custom style the variations of timelines?
Thank you!
ok, I answered my first question by modifying line 1840 of class-dzstln.php to: $wpqargs[‘order’]=”DESC”; /* changed from ASC */
6) How do I get the Read More Markup and Extra HTML content to render in this timeline: [zoomtimeline mode=”mode-slider” post_type=”project” cat=”all” date_format=”F Y” skin=”skin-light” desc_length=”200” mode_slider_variation_content_position=”top” strip_shortcodes=”off” strip_html=”off”]
I do not see the Read More Markup I have configured rendering at all in my timeline: <a href=”{{thepostpermalink}}” > Read More</a>
Here is an example of the problem: http://bigbadwolfenterprises.com/our-history/
Nor does the Extra HTML content render and when I Inspect Element on the page it appears that it’s not properly getting extracted by this code in your class-dzstln.php file: ’.$extra_html.’
Hello
Sorry for the delay
1) There was the same comment earlierd and I replied with the solution
2) You need to input there the categories ID . Instructions here – http://digitalzoomstudio.net/docs/wpzoomtimeline/ ( search for “category id” )
3) These are generated by our shortcode generator . By the way are you using it ? There are options for order too
You can access it from the WP Dashboard > ZoomTimeline ( there’s a button on top ) – you can paste the output from it to a Divi Builder text block
4) Can you show me a link ?
5) No, sorry we don’t offer support for customizations
6) I’ll investigate and get back to you
Thanks
Radu
Hello, Can you please tell me how I can change the color of the diamond-arrow-left and diamond-arrow-right? I have tried everything but can not change the color. I do not see how to do this in the documentation. Thank you!
Hello
It ZoomTimeline > Extra CSS
.zoomtimeline.mode-yearslist .details-container .diamond-arrow-left rect, .zoomtimeline.mode-yearslist .details-container .diamond-arrow-right rect{
fill: #ff0000;
}
Thanks!
Thank you soo much! Great plugin and great support!
Hello
Is there a way to display and count the comments for each post and place that next to the title of the post or the date?
Hello
For which mode ? Maybe I can make an option for you
Thanks!
All/any of them. I am separating posts in different categories with different views on different pages.
Hello
Something like displaying count of comments would require custom work for all modes. Do you have a mockup of where would you want the count displayed ?
Thanks!
Hello,
I am having some issues with the dates feature on the plugin. It looks like some of the dates are not showing up correctly even though the date on that item is correct. Do you know how we could fix this?
https://monosnap.com/file/YLKSa5rxGmtOH5iQ8LQdzGk5XyPPL1Thank you!
Can you show me the link to your implementation ?
Thanks!
I have tried editting rules in css to change colors in my yearlist timeline but not working, could you please let us know a way or explain how to make the yearlist have the light skin enabled? Yearlist mode does not work, I purchased the plugin because of this option if its black it ruins the whole color schema in the site I am working on with it.
Hello
I added explination here for you – search for How to edit a color in the Timeline
http://digitalzoomstudio.net/docs/wpzoomtimeline/Thanks!
Hi, thanks, I was able to switch the main container but neither gradient edges nor arrows below to switch posts… Is there any way to create new color scheme rules? I keep trying through zoomtimeline.scss but nothing changes, am I doing something wrong? Is there any way you can help me? Please and thanks again!
Hi again, I mannaged to change color to arrow diamonds, but still cant figure out about the gradient. Any clues? http://prntscr.com/b0pjnu I also want, if possible, to have my year list to start from the left side of the container, please let me know if its a possible change too.
Thanks.
Hello
Add this in ZoomTimeline > Settings, Extra CSS field
body .zoomtimeline.mode-yearslist .yearlist-con{ background-color: #ff0000; }
body .zoomtimeline.mode-yearslist .yearlist-container:after{
background: linear-gradient(to right, rgba(34, 34, 34, 0) 0%, #ff0000 79%, #ff0000 100%);
} body .zoomtimeline.mode-yearslist .yearlist-container:before{
background: linear-gradient(to right, #ff0000 0%, #ff0000 21%, rgba(34, 34, 34, 0) 100%);
}
Thank you, it worked! I would love to have the first year reference starting from the left side of the timeline, would that be possible?
Thanks for your help!
Hello
Yes,
Go to Plugins > Editor select DZS ZoomTimeline
select zoomtimeline.js line 1085 replace
var aux = ( conw / 2 - _cachY.width() / 2) - ind*_cachY.width();
with
var aux = ind*_cachY.width();
Thank you so much for your help, I love my customized timeline. I will give a good recomendation for it and the support you give, its really appreciated!!
Thank you very much! Glad to help you!
Hi, is there any way i can make the timeline descending? i would like to show the latest item first.
Hello
Yes, just append
wpqargs="order=desc"to your shortcode
ie.
replace[zoomtimeline mode="mode-slider-variation" post_type="timeline_items" cat="all" date_format="default" skin="skin-light" desc_length="100" mode_slider_variation_content_position="bottom" strip_shortcodes="on" strip_html="on" ]
make it
[zoomtimeline mode="mode-slider-variation" post_type="timeline_items" cat="all" date_format="default" skin="skin-light" desc_length="100" mode_slider_variation_content_position="bottom" strip_shortcodes="on" strip_html="on" wpqargs="order=desc"]
I’ll add option for this next update
Thanks!
Hi! I bought your plugin and have started to dig into it, but I agree with the unverified comment above that the documentation seems incomplete and I find myself with questions, specifically…
- the skin/mode details. The documentation states:
Make your own skin, duplicate skin_white.css to skin-custom.css for example..
but the plugin has no such “skin_white.css” file in the first place. :cry: - The timeline category filter doesn’t seem to work, I can always see all of my timeline items when I display them using VC. Perhaps my timeline cats aren’t unique to the site? Any notes about integrating timeline cats with the site and/or bringing site categories into the timeline?
- I’m using a theme that utilizes a (mostly) one-page design (thanks to VC). When a user clicks on a thumbnail/excerpt of a post/page in a list view, a modal window appears, displaying the “full” content of the post without having to necessarily visit a separate page. It functions like a lightbox gallery except with blocks of content such as text, not just images. Specifically, this has been accomplished by creating “work” and “people” custom post types. These custom post types look great when I display them as a ZoomTimeline however, I of course lose the modal functionality that is so key to my existing site. Can I change the functionality of what happens when the “read more” link is clicked so that it triggers a modal view of the post instead of taking the user to a new place?
I know that this might be out of the scope of support that you offer but since the documentation was so vague, I feel I’m at a loss in terms of resolving the issue myself. Thanks in advance!
Hello
I redone the documentation – http://digitalzoomstudio.net/docs/wpzoomtimeline/
. The documentation is brief, yes. But it is so because most options are explained right below them.
. You are right, thanks for the find. I just submitted update.
. You are right – we can’t offer support with this kind of theme inter operability. It would be custom work
Thanks!
Radu
UPDATE 1.24 [ 05/03/2016 ]
- [FIX] category not working for visual composer
Thank you for updating the documentation!
Maybe my remaining issue here is in syntax/phrasing, but under MAKE YOUR OWN SKIN the new documentation states, “We will make a new mode based on a mode that already exists.” However it then outlines the steps for how to CHANGE a MODE (copy css and add it to the extra css area with the !important attribute) and not in fact, how to make a new one (skin or mode) without sacrificing an existing one.
Please correct me if i’m wrong, but of the box, this plugin comes with SIX or SEVEN timeline MODES, but just ONE of them (onCenter) has SKINS (light and dark) style variations. What if i wanted to make light/dark skins for all the different modes, could i just do that by adding the relevant CSS via the “extra css” area or would the plugin ignore any skin info unless the OnCenter mode was selected?
I should again state that I’m using this with VC so I’m rarely looking at shortcodes, but if what I want can be achieved by editing them directly, then I can make that happen. I did have the expectation that anything that could be done with this plugin could be achieved via VC, but if that’s not true, I’ll just stop working under that assumption.
Additionally, the instructions about “how to edit a color in a timeline” outline how to use chrome’s Inspect Element to view the current css for the item you want to adjust, but the example you pick is a bad one because that particular .yearlist-con element includes hard-coded gradient .svgs that will always be black, regardless of the css background color or its !importance. 
Hello
Creating a new mode would require some extensive javascript / css knowledge, so we cannot cover that kind of customization. But I did cover in the documentation on how to change colors.
Yes, you are correct. Only mode-oncenter , and mode-default have skin-light / skin-dark at the moment.
Yes, that example may be a little bad, but not too bad.
Take a look
Basically the problem is that the gradient that gives a nice end flow to the dots is a different color
but it’s not a big problem to change them as they are not hard coded
Just adding this to Extra CSS works
body .zoomtimeline.mode-yearslist .yearlist-container:after{
background: linear-gradient(to right, rgba(34, 34, 34, 0) 0%, #7B4545 79%, #7B4545 100%);
} body .zoomtimeline.mode-yearslist .yearlist-container:before{
background: linear-gradient(to right, #824343 0%, #824343 21%, rgba(34, 34, 34, 0) 100%);
}
Creating a new mode would require some extensive javascript / css knowledge, so we cannot cover that kind of customization.For those of us who do have extensive js/css knowledge, but who are unfamiliar with shortcodes or SASS, could you point us to some cursory explanation of the moving parts? I respect that you can’t offer support for every crazy thing that a customer requests, and you are working with an incredibly wide range of users whose abilities and understandings vary to insane degrees, but in my opinion, showing us how to use Inspect Element – while critical to those who are not yet familiar with the tool – isn’t the same thing as providing documentation on how your code works or how it can be modified.
Am I right that “skins” and “modes” are words you use to describe some variations in layout and design for the six pre-coded timeline options but that there are no actual “skin” or “mode” elements, files or directories in the plugin? Everything we can change is css and all the css is in one file?
In the next release would you consider adding a seventh mode, “custom” to your list that IS REDUNDANT but could be utilized by your users to modify without negatively affecting the functionality of your “real”modes/skins? Maybe just point us to the specific file you would go to if you wanted to make a new variation.
Lol like a child theme for your plugin 
(and btw your last release, 1.24, has yet to make it to envato’s pages, does it usually take nine+ days?)
THANK YOU ZOOMIT
Hello
I think the best option for this is I add 2 action in the plugin in which you can hook with your custom plugin code.
One would be the mode selection screen. Here you can add with your custom plugin, the selection for your custom mode with any name ( not just only mode-custom )
Another action would be the item parsing in which you can hook and add any properties.
And all this would be that on main plugin update, your changes will not be lost as it will be in a separate plugin.
What do you think ?
PS: We plan to release 2 new modes next month so hopefully it will cover more uses.
Thanks!
Hi just purchased the plugin, it works great, I was wondering if it would be possible to change colors in the year list mode. I keep choosing light skin and keeps showing dark skin…I’d love to customize color on the timeline, if not possible, is it possible to at least fix this issue? thanks in advance
Hello
Dark skin option is only for mode-oncenter as stated under the option
For which mode would you like to use dark skin ? Maybe we can implement it
Thanks!
I have tried editting rules in css to change colors in my yearlist timeline but not working, could you please let us know a way or explain how to make the yearlist have the light skin enabled? Yearlist mode does not work, I purchased the plugin because of this option if its black it ruins the whole color schema in the site I am working on with it.
I have wrote guide here – http://digitalzoomstudio.net/docs/wpzoomtimeline/ – search for How to edit a color in the Timeline
Hi again,
I’ve been asked by client to make the timeline stop once it reaches the last item (date/year). Please could you help me accomplish this modification? Thanks in advance.
Hello
Send me a PM via my profile
I can send you update which allows you to do that
Thanks!
Hello, I just purchased your timeline pack. It’s nice, thanks for offering it!
I have two questions and two suggestions:
Questions:
1. CONTENT POSITION: If I choose between “Top” and “Bottom” nothing changes. (Especially for the “Years List”-Mode)
2. SLIDER VARIATION: If I chose “Mode”>”Slider Variation”, I don’t see anything on the frontend.
Here’s the link: http://eginoweinert-stiftung.de/vita/ (It’s a fresh WordPress installation, only 5 plugins installed so far, everything latest versions.)
Suggestions:
1. It would be great so navigate/skim through all the years using the arrow left and arrow right (or up and down vor vertically) for scrolling horizontally.
2. It would be nice if there’s a way to search for a year / date – or choose from a dropdown list. Because if I have 100 different entries (e.g. a vita of a well-known person), it would be nice to filter for a specific year or date.
Thanks Daniel
Hi Daniel
1. Yes that is only for the slider variation mode as stated in the description below the option
2. Weird, can you show me a link for that ?
-1. Good idea we’ll implement in right / left for mode-yearslist
-2 We’ll think about adding this too a future update. Great suggestion
Thanks!
Hello,
I have purchased and installed the plugin but was wondering if it was possible to change the order of items in a layout like this – https://0.s3.envato.com/files/177070005/index-timelineslider.html For example – Timeline Bar, Image, Copy versus what’s currently there (Copy, Timeline Bar, Image)
Also, is it possible to delete the arrow that shows up after the Read More link?
Thank you!
Hello
I submitted 1.23 with this option for you
UPDATE 1.23 [ 04/25/2016 ]
- [ADD] shortcode option to place content at bottom for mode-slider-variation
- [ADD] shortcode generator link in settings page
- [ADD] readmore markup option in main settings
Thanks!
Hello. We purchased and installed the plugin. It works nice and we can configure the styles. The documentation is not clear enough, also it seems somehow incomplete, and it seems the documentation ws based on another documentation and have its leftovers here and there. Besides that we found the mode Slider Variation looks nice on desktop but behaves very poorly on smartphones. I guess the scripts lose synchronization then the thing becomes a mess. How can we solve it?
Hello
Please submit comment from the account you purchased the plugin from
Thanks!