WordPress.org

Ready to get started?Download WordPress

Forums

Spun
[resolved] Custom Circles order (28 posts)

  1. Xeniya
    Member
    Posted 6 months ago #

    Hello everyone,

    I've made the custom circles on my home page but they do not appear as my Menu. It's important for me to have a strict order of the pages.

    I am wondering how to change the order of the custom circles? I tried to create a special menu for them but it didn't work out. Also, I tried to give order per page but it doesn't work out as well.

    Website: http://www.girlsxchlamydia.nl/

    Thanks!

    Xeniya

  2. Andrew
    Forum Moderator
    Posted 6 months ago #

    I've made the custom circles on my home page but they do not appear as my Menu.

    What do you mean by "custom circles" and "menu", for clarification?

  3. Xeniya
    Member
    Posted 6 months ago #

    I followed your Guide: Create custom circles on the Home page] and created custom circles on the Home page which direct to other pages when you click on them.

    However, I've still the menu navigation.bar on the right top corner so the visitor can easily go to another page.

    The custom circles (pages) on the Home page appear in different order than navigation menu. I would like to change that and put them in the order that I need.

  4. Andrew
    Forum Moderator
    Posted 6 months ago #

    I see, I'll look at implementing this too.

    If you need a quick fix for now you could re-order your navigation menu in the dashboard under Appearance > Menus. If you don't have a custom menu there you can create one with the order you want.
    http://codex.wordpress.org/Appearance_Menus_Screen

  5. Andrew
    Forum Moderator
    Posted 6 months ago #

    I made a mistake in Stage 6 - Coding and have amended it on the guide.

    If you want to amend that for yourself you can follow this:

    1. Copy "index.php" from the Spun Theme
    2. Paste it into your Child Theme directory
    3. Edit that "index.php" file now within your Child Theme directory
    4. Replace all of its code with the code from this PasteBin page: http://pastebin.com/kZZsZ3SA
    5. Save that file
    6. Create a new file called "content-custom-circles.php" in your Child Theme directory
    7. Edit your "content-custom-circles.php" file and put into it all of the code from this PasteBin page: http://pastebin.com/PDmBtvgC
    8. Save that file
    9. Remove your "content-home.php" file that's within your Child theme directory

    Although that won't directly relate to your re-ordering question, it'll help me provide a solution as we'll have the same code.

  6. Andrew
    Forum Moderator
    Posted 6 months ago #

    To re-order the Custom Circles you'll need to do 3 more stages:

    • Stage 1 - Creating a new Custom Field
    • Stage 2 - Adding files and folders
    • Stage 3 - Coding

    Stage 1 - Creating a new Custom Field

    1. Go to the "Custom Content Types" section of the dashboard: http://snag.gy/yAOan.jpg
    2. Go to the "Custom Fields" part: http://snag.gy/Q9dXy.jpg
    3. Click on the "Create Custom Fields" button: http://snag.gy/PO7Qi.jpg
    4. Scroll down and select the "Text" field: http://snag.gy/CBzlj.jpg
    5. In "Label" enter "Order"
    6. In "Name" enter "order"
    7. In the "Validation Rule" dropdown list under "Validation select "Number"
    8. Tick the "custom_circles" checkbox underneath the "Associations" section
    9. Save: http://snag.gy/URiBy.jpg

    Now edit your Custom Circle: http://snag.gy/sR59E.jpg
    And there you'll see your "Order" field, in which you can enter the order you want the circle to appear: http://snag.gy/3lVMK.jpg

    Stage 2 - Adding files and folders
    Add the following to your Child Theme directory:

    • A "functions.php" file
    • A "js" folder
    • In that "js" folder create a file called "reorder-custom-circles.js"

    Stage 3 - Coding
    Then enter into those files:

    1. In your Child Theme "functions.php" file add all of the code from this PasteBin page: http://pastebin.com/FMTwcBk4
    2. In your Child Theme "reorder-custom-circles.js" file add the code from this PasteBin page: http://pastebin.com/5uwjAPy8
    3. In your Child Theme "content-custom-circles.php" file replace all of the code with the code from this PasteBin page: http://pastebin.com/c8jrMkCa
  7. Xeniya
    Member
    Posted 5 months ago #

    Hello Andrew,

    Thanks for the help but now I have my recent posts on the Home page as well. I don't want them to appear there :) How to remove them from there? The page for my recent posts is News subpage under Action page.

    If I create the Home page and change Settings - Reading - Front page displas from latest post to static then Custom circles move to News page and Home page is empty.

    Also, I gave the order to custom circles but they appeared in the reverse way. So number 5 is 1st right now. I can solve it out by myself but just want to mention it ;)

    Last thing, the text (titles) don't appear in the circles anymore.

  8. Andrew
    Forum Moderator
    Posted 5 months ago #

    Also, I gave the order to custom circles but they appeared in the reverse way. So number 5 is 1st right now. I can solve it out by myself but just want to mention it ;)

    Make sure your "content-custom-circles.php" file has all and only the code of this PasteBin page: http://pastebin.com/c8jrMkCa

  9. Xeniya
    Member
    Posted 5 months ago #

    Make sure your "content-custom-circles.php" file has all and only the code of this PasteBin page: http://pastebin.com/c8jrMkCa

    It has only the code from that PasteBin page but still the News page which should 5th is the 1st right now.

    What about other questions? Is it possible to solve them out?

  10. Andrew
    Forum Moderator
    Posted 5 months ago #

    Can you create new threads to discuss your other issues?

  11. Xeniya
    Member
    Posted 5 months ago #

    Sure

  12. Andrew
    Forum Moderator
    Posted 5 months ago #

    I think this is because I told you to remove the "content-home.php" file from your Child Theme.

    I'm guessing you originally had followed this guide: http://wordpress.org/support/topic/put-test-inside-images-on-home-page?replies=3 - had you?

  13. Andrew
    Forum Moderator
    Posted 5 months ago #

    had you?

    Assuming "Yes":
    You need to recreate that "content-home.php" file in your Child Theme directory and put all of this code into it: http://pastebin.com/5PzrWLC2#

  14. Xeniya
    Member
    Posted 5 months ago #

    Did it. Didn't help. Still the same problem

  15. Andrew
    Forum Moderator
    Posted 5 months ago #

    Can you replace all of the code in your content-custom-circles.php file with the code in this PasteBin page: http://pastebin.com/zUeDEfGx

  16. Andrew
    Forum Moderator
    Posted 5 months ago #

    Then:

    1. In your "js" folder of your Child Theme create a new file called "text-in-circles.js".
    2. Into that "text-in-circles.js" file add the code from this PasteBin page: http://pastebin.com/knH83C5e
    3. In your Child Theme functions.php file just after this line:
      add_action( 'wp_enqueue_scripts', 'enqueueReorderCustomCircles' );

      Add the following code:

      function textInCircles() {
              wp_enqueue_script( 'text-in-circles', get_stylesheet_directory_uri() . '/js/text-in-circles.js', '', '1.0', true );
      }
      
      add_action( 'wp_enqueue_scripts', 'textInCircles' );
  17. Xeniya
    Member
    Posted 5 months ago #

    Didn't help either =(

    Maybe it's a good idea to do everything all over again?

    If yes, which guide I should follow then?

  18. Andrew
    Forum Moderator
    Posted 5 months ago #

    The custom circles guide didn't contain any text in the titles when there were images - and so without knowing what modification you did I can't replicate that. What I just tried to do was to add my own modification to put the title in the circles.

    Can you remember what you did to put the titles in the Custom Circles with images?

  19. Xeniya
    Member
    Posted 5 months ago #

    Let me restore my back up and check the files. I will reply back in 30 min.

  20. Xeniya
    Member
    Posted 5 months ago #

    Ok,

    This is weird. Now my page looks like that http://snag.gy/d82J9.jpg
    The text doubled itself but in two different fonts - the default font of Spun theme and the font that I added (A Song for Jennifer)

    Now, I found the code in the stylesheet.css which mentions the font in the circles:

    .blog .hentry span.hometitle {
     width: 100%;
     position: absolute;
     top: 73px;
     display: table-cell;
    
     font-family: "a song for jennifer", serif;
     font-size: 30px;
     font-size: 3.2rem;
     font-style: normal;
     text-align: center;
    
     line-height: 1.2;
     vertical-align: middle;
     word-wrap: break-word;
     color: #fff;

    The weird part is that I didn't create custom circles (http://snag.gy/sY0ek.jpg) but somehow they're on Home page. Have no clue how I did that. I was following the old Guide step by step.

  21. Andrew
    Forum Moderator
    Posted 5 months ago #

    A quick fix would be to hide one of the titles;

    .hentry img ~ .thumbnail-title {
     display: none;
    }
  22. Xeniya
    Member
    Posted 5 months ago #

    Ok, that fixed. Thanks!

    So now, coming back to initial problem with order. How do I solve it?

    I don't have created custom circles so I can't give the order. I tried to create them and give order but nothing changes.

    Apparently, custom circles somehow copied the navigation bar and copied it according to the creation date of the page because News subpage was created on 10th of Jan and it's the first page now.

  23. Andrew
    Forum Moderator
    Posted 5 months ago #

    Apparently, custom circles somehow copied the navigation bar and copied it according to the creation date of the page because News subpage was created on 10th of Jan and it's the first page now.

    Sorry, but didn't you say you didn't do the Custom Circles?

  24. Xeniya
    Member
    Posted 5 months ago #

    I meant that I didn't create the actual custom circles. Check this screenshot - http://snag.gy/sY0ek.jpg
    There is not any custom circle but I have created Content Type in Custom Content Type ( http://snag.gy/fzOBp.jpg) with active custom_circles and custom fields (Image, Link and Order) - http://snag.gy/1zMi9.jpg

  25. Andrew
    Forum Moderator
    Posted 5 months ago #

    It looks like by default the newly created default circles appear on the top left.

  26. Xeniya
    Member
    Posted 5 months ago #

    Is possible to change?

  27. Andrew
    Forum Moderator
    Posted 5 months ago #

    Probably, I don't know where the query is called, but somewhere it is calling posts by descending order. You could just rewrite the query to use ascending order.

  28. Xeniya
    Member
    Posted 5 months ago #

    Solved it.

    I just changed the date of creation of each page :)

    Thanks a lot for your effort and help!

Reply

You must log in to post.

About this Theme

About this Topic