Tagged: arrows, enfold, post navigation
-
AuthorPosts
-
January 10, 2023 at 4:47 pm #1378162
I have the following problem:
according to the graphic layout I had to apply to a website, I need the navigation arrows appearing within two distinct columns (one for left and one for right) within the portfolio single page. Normally they appear at the very left and right side of the screen.
According to my graphic they should stay beneath an opening slider, and they must appear as a white simple arrow over a black background.
At this link you can see the layout.Possible solution: since the arrows are positioned as fixed, I can move them on a certain extent using an absolute position, but they will never appear exactly in the middle of my two columns.
I was thinking to re-create the arrows through the file function.php as a simple shortcode that I can then insert as a text block within each column.Is that feasible? Thanks
- This topic was modified 1 year, 10 months ago by elenapoliti.
January 13, 2023 at 11:22 am #1378559Hi, concerning the above topic do you have a suggestion? Thanks in advance
January 14, 2023 at 7:11 pm #1378693Hi,
Thanks for your patience, thanks for the screenshot, I can help you create a shortcode for the post navigation as two arrows in boxes like this:
Add this code to the end of your child theme functions.php file in Appearance ▸ Editor:add_shortcode( 'prev', 'prev_shortcode' ); add_shortcode( 'next', 'next_shortcode' ); function next_shortcode($atts) { global $post; ob_start(); next_post_link( '<div class="next-shortcode">%link</div>', '>' ); $result = ob_get_contents(); ob_end_clean(); return $result; } function prev_shortcode($atts) { global $post; ob_start(); previous_post_link( '<div class="prev-shortcode">%link</div>', '<' ); $result = ob_get_contents(); ob_end_clean(); return $result; }
If you are not using a child theme I recommend the WPcode plugin this plugin supports PHP code snippets, JavaScript code snippets, & CSS code snippets and allows you to export and import your custom code snippets to other sites that you may have or as a backup.
Then add this css to your Enfold Theme Options ▸ General Styling ▸ Quick CSS field or the WPcode plugin.prev-shortcode,.next-shortcode,.total-count { text-decoration: none; line-height: 40px; width: 40px; height: 40px; display: block; float: left; margin-left: -1px; overflow: hidden; border-style: solid; border-width: 1px; border-radius: 0px; text-align: center; } .prev-shortcode a,.next-shortcode a { line-height: 40px; width: 40px; height: 40px; display: block; }
Now you can place the shortcodes
[prev] [next]
in a code block where you want them to show
I notice that your screenshot showed a box that counted the number of posts, but I didn’t find a way to display the “number of number”.Best regards,
MikeJanuary 16, 2023 at 11:45 am #1378832Thanks Mike, your solution works nicely. Yes the number of posts is something the client wanted but I see it a little bit hard. The problem is that I am using portfolio pages to show these forms, that have different categories. So the total number of posts actually shown should be the total within a certain category. I am not sure I could make it.
January 16, 2023 at 1:47 pm #1378869Hi,
Glad to hear this helped, but to get the post count “number of number” like: [1/76] will be much harder and out of the scope for this forum.
If you really need this I recommend hiring a freelancer on upwork.com
unless there is anything else we can help with on this issue, shall we close this then?Best regards,
MikeJanuary 16, 2023 at 1:48 pm #1378870Thanks for your answer Mile, yes you can close the ticket
January 16, 2023 at 2:41 pm #1378879Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘Create shortcode for post navigation left/right arrows portfolio entries’ is closed to new replies.