web-dev-qa-db-fra.com

CSS n'affectant pas la sortie du widget

je ne suis donc pas encore novice en développement wordpress, alors ne vous déchaînez pas et je suis désolée si j'ai fait quelque chose de vraiment stupide.

J'ai donc des problèmes avec mon CSS, pour une raison quelconque, cela n'affecte pas la sortie du contenu du widget, ce qui peut être vu dans le fichier movieposterdisplay-class. Ce que j'essaie de faire est de faire en sorte que la taille automatique de la vidéo youtube générée corresponde au conteneur en utilisant CSS. Ce que je veux savoir, c'est pourquoi le CSS n'affecte pas le code HTML et une solution pour le résoudre. Merci d'avance pour votre aide.

movieposterdisplayfile

require_once(plugin_dir_path(__FILE__).'/includes/movieposterdisplay- 
  scripts.php');

require_once(plugin_dir_path(__FILE__).'/includes/movieposterdisplay- 
  class.php');

function register_movieposterdisplay(){
  register_widget('Movie_Poster_Display_Widget');
}

add_action('widgets_init', 'register_movieposterdisplay');

movieposterdisplay-scripts fichier

<?php
function mpd_add_scripts(){

wp_enqueue_style('mpd-main-style', plugins_url().'/movieposterdisplay/css/style.css');

wp_enqueue_script('mpd-main-style', plugins_url().'/movieposterdisplay/js/main.js');
}

add_action('wp_enqueue_scripts', 'mpd_add_scripts');

movieposterdisplay-class file (le fichier contient la sortie du widget)

<?php
class Movie_Poster_Display_Widget extends WP_Widget {

function __construct() {

parent::__construct(
  'movieposterdisplay_widget', // Base ID
  esc_html__( 'Movie Widget', 'mpd_domain' ), // Name  
  array( 'description' => esc_html__( 'Displays Movie/TV posters, overviews and trailers.', 'mpd_domain' ), ) 
  );
}

public function widget( $args, $instance) {
echo $args['before_widget']; 

  $trailer_key ="http://www.youtube.com/embed/" .$this->display_trailer($instance, $first_movie_result)."?enablejsapi=1";
  ?>

  <div class="youtubeplayer">
    <iframe 
    id="player" type="text/html"
    src="<?php echo $trailer_key;?>"
    frameborder="0" allowfullscreen="allowfullscreen">
    </iframe>
  </div>
  <?php 
echo $args['after_widget'];
} 

style.css

.youtubeplayer {
  position: relative;
  padding-bottom: 75%; 
  padding-top: 25px;
  height: 0;
  border: 5px solid red;
}

.youtubeplayer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
1
Dev john

Le problème était dû à un chemin de fichier incorrect dans le fichier movieposterdisplay-scripts. Alors que le fichier chargé correctement dans le fichier php require_once(plugin_dir_path(__FILE__).'/includes/movieposterdisplay- class.php'); principal car il a déjà attribué le nom de dossier du plugin correct. Il n'a pas été mis en file d'attente correctement car le code était wp_enqueue_style('mpd-main-style', plugins_url().'/movieposterdisplay/css/style.css'); et j'avais précédemment changé le nom du dossier.

Par conséquent, je pensais que le chargement était correct et que tout fonctionnait bien, mais le chargement était correct.

0
Dev john