Custom circles alternate with posts

Sorry, which custom circle should be where?
Your problem is not apparent: https://snag.gy/sI2wL.jpg

Sorry – I’ll try to be more clear.

The pictures are the custom circles. The circles with texts are the posts. So, the pictures should be circles 2, 4, 6, 8 and 10.

On the top line you will see that I have been able to get the circles to order properly. The posts are circles 1, 3 and 5 and the custom circles with pictures are at 2 and 4.

On the second line, all of the custom circles with pictures are in the last 3 places – 8, 9, 10. Even though their ORDER numbers are 6, 8, 10.

I have played around with changing the post publish dates and order numbers, but it doesn’t make a difference on the second line – the ordering command just isn’t working there.

Let me know if that doesn’t make sense and I can try to explain differently. Thanks.

It’s an issue with the JavaScript I’m using to reorder the circles and am working on a fix.

If any developers are watching, I’m really struggling with this one. You can’t just simply use “insertAfter” here in this scenario:

Scenario A
You have 4 custom circles (CC):

• Custom Circle 1
• Custom Circle 2
• Custom Circle 3
• Custom Circle 4

And 4 normal circles (NC):

• Normal Circle 1
• Normal Circle 2
• Normal Circle 3
• Normal Circle 3

By default the Custom Circles append the Normal Circles as:
NC1, NC2, NC3, NC4, CC1, CC2, CC3, CC4

Using this jQuery you manipulate the DOM so that:
CC1 is second,
CC2 is third and,
CC3 is fourth

So now you have this order of circles:
NC1, CC1, CC2, CC3, NC2, NC3, NC4, CC4

All is well.

Then you decide to move CC4 first. The order of circles then becomes:
CC4, NC1, CC1, CC2, CC3, NC2, NC3, NC4

So, the issue is:
CC1 is no longer second,
CC2 is no longer third and,
CC3 is no longer fourth.

I think the solution for Scenario A is to re-shuffle the circles to their correct order. They need to reshuffle when a Custom Circle is moved in-front of other custom circles, which disrupts the order of the other circles.

Andrew, thanks again for helping. I am new to this, and it’s clearly beyond my current capabilities. Let me know if there’s anything I can try out to assist.

A bit of a rubbish workaround, but a possible lead (written in pseudo code for now):

// $circles = array

// For each circle {

  // Get the order number out and store it in the $circles array
  // Get the current circle object and store it into the $circles array

// }

// Re-order the circles from within the array

// Remove all the circles from the DOM

// Add all the circles into the DOM from the $circles array with the correct orders

So, the difference is you first you re-order the circles all at once.

I’ve asked for help on a jQuery forum: https://forum.jquery.com/topic/sorting-an-array-of-objects-by-multiple-properties

Just letting you know; We are in a position where we have to wait for someone to help us. I might post on a JavaScript forum later on because it may not be a jQuery issue.

I’ll be trying to figure this out by myself as well, so there’s a glimpse that I could have a “Eureka” moment, but don’t count on it ;]

If you need this ordering issue resolved urgently then I recommend getting a professional to do it for you:
– https://jobs.wordpress.net – Ask/ look for a “JavaScript developer” or “jQuery developer”
– Or https://directory.codepoet.com

Thanks again for all your help so far Andrew. This is not incredibly time sensitive yet, so I will wait it out for a little bit and work on other aspects of the site.

I just want to bump this thread and see if anyone has come across this issue yet and solved it.

To recap – I have custom circles on my home page that I want to alternate with my post circles. I can get the top row to alternate, but the following rows will not.

Any help would be greatly appreciated.

Thanks.

I actually just came up with an acceptable solution for this – the custom circles properly alternate when I change the amount of circles in a row to 3 rather than 5. This is fine for my site design. Thanks for all your help previously Andrew.