I hope this question is not too abstract to be asked here, if it is, I apologize in advance.

In my theme I have a custom theme options page that I've set up to control my front page slider. Basically there are several fields and each of them apply to a certain frame with in the front page image slider.

It functions well, but I was hoping to figure out a way to be able to reorder the slides, not just edit the slide's content.

This is a snippet from my options page:

<input type="text" name="frame1_image" size="85" value="<?php echo get_option('frame1_image'); ?>" /> << Main Image URL<br />
                <input type="text" name="frame1_thumb" size="85" value="<?php echo get_option('frame1_thumb'); ?>" /> << Thumbnail Image URL<br />
                <input type="text" name="frame1_title" size="85" value="<?php echo get_option('frame1_title'); ?>" /> << Title<br />
                <input type="text" name="frame1_link" size="85" value="<?php echo get_option('frame1_link'); ?>" /> << Link<br />
                <input type="text" name="frame1_category" size="85" value="<?php echo get_option('frame1_category'); ?>" /> << Category<br />

and that is repeated five times, each with their own variables for the fields.

and this is the slider code:

<div class="slider-wrapper">
                        <div id="slider" class="nivoSlider">
                            <a href="<?php echo get_option('frame1_link'); ?>"><img src="<?php echo get_option('frame1_image'); ?>" alt="" data-thumb="<?php echo get_option('frame1_thumb'); ?>" title="#htmlcaption1"></a>
                            <a href="<?php echo get_option('frame2_link'); ?>"><img src="<?php echo get_option('frame2_image'); ?>" alt="" data-thumb="<?php echo get_option('frame2_thumb'); ?>" title="#htmlcaption2"></a>
                            <a href="<?php echo get_option('frame3_link'); ?>"><img src="<?php echo get_option('frame3_image'); ?>" alt="" data-thumb="<?php echo get_option('frame3_thumb'); ?>" title="#htmlcaption3"></a>
                            <a href="<?php echo get_option('frame4_link'); ?>"><img src="<?php echo get_option('frame4_image'); ?>" alt="" data-thumb="<?php echo get_option('frame4_thumb'); ?>" title="#htmlcaption4"></a>
                            <a href="<?php echo get_option('frame5_link'); ?>"><img src="<?php echo get_option('frame5_image'); ?>" alt="" data-thumb="<?php echo get_option('frame5_thumb'); ?>" title="#htmlcaption5"></a>

                        <div id="htmlcaption1" class="nivo-html-caption">
                            <div class="slider_cat"><span><?php echo get_option('frame1_category'); ?></span></div>
                            <?php echo get_option('frame1_title'); ?>
                        <div id="htmlcaption2" class="nivo-html-caption">
                            <div class="slider_cat"><span><?php echo get_option('frame2_category'); ?></span></div>
                            <?php echo get_option('frame2_title'); ?>
                        <div id="htmlcaption3" class="nivo-html-caption">
                            <div class="slider_cat"><span><?php echo get_option('frame3_category'); ?></span></div>
                            <?php echo get_option('frame3_title'); ?>
                        <div id="htmlcaption4" class="nivo-html-caption">
                            <div class="slider_cat"><span><?php echo get_option('frame4_category'); ?></span></div>
                            <?php echo get_option('frame4_title'); ?>
                        <div id="htmlcaption5" class="nivo-html-caption">
                            <div class="slider_cat"><span><?php echo get_option('frame5_category'); ?></span></div>
                            <?php echo get_option('frame5_title'); ?>

Like I said this works well to replace the data in the slider, but when I want to re-order the slides, I often have to deleted every field, then re input them all, even if I want to just add a new slide to the front.

I was thinking that maybe a meta field that has a drop down selector for which slide number it should go in. So on the settings page, there could be all the fields for the slide info, and then a drop down that select which frame. But I am not sure how I would implement that.

Any ideas or suggestions would be greatly appreciated!


  • You'd really just be doing the same as you've already done, but a bit more abstractly. What is it that you don't know how to implement? – s_ha_dum Aug 2 '13 at 19:03
  • I know how to implement the drop down meta fields, but I am not sure how the 'logic' would go in the html. For example, how would I make the if statements for sort the slides. – Jacob Aug 3 '13 at 3:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.