如何使 bootstrap 进度条为 wordpress 动态化

Question

我想让 bootstrap WordPress 的进度条动态化。我想将自定义字段添加到管理面板中（当想写新的 post 时），例如，如果我给值 6，它在进度条上显示为 60%，同样在 0 到 10 之间表示 0% 到 100进度条百分比。

这是我的html进度条代码：

<p>
 <div class="progress progress-striped active">
   <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 100%">IMDB Rating
<span class="sr-only"></span>
   </div>
 </div>
</p>

谢谢。

Answer 1

希望对您有所帮助。

<?php $progress = get_post_meta($post->ID, 'your_custom_field', true); ?>
<p>
<div class="progress progress-striped active">
  <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="<?php echo $progress*10; ?>" aria-valuemin="0" aria-valuemax="100" style="width: <?php echo $progress*10; ?>%">IMDB Rating
<span class="sr-only"></span>
</div>
</div>
</p>

Answer 2

@dhanuka-nuwan 这段代码可以工作，但无论我给它什么值，它都会在 85% 时停止！

我是这样用的：

<?php $selected = get_post_meta($post->ID, 'my_meta_box_select', true); ?>
  <div class="progress progress-striped active">
  <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="<?php echo $selected*10; ?>" aria-valuemin="0" aria-valuemax="100" style="width: <?php echo $selected*10; ?>%">
<span class="sr-only"></span>
  </div>
  </div>

如何使 bootstrap 进度条为 wordpress 动态化

how to make bootstrap progress bar dynamic for wordpress

wordpress

progress

twitter-bootstrap