[Resuelto] como poner css en plugin de WP

[p4xk3]

Hola

he estado trabajando en un plugin para wordpress para generar un galeria de imagenes a partir de una fuerte RSS

me base en este codigo:

Código (php) [Seleccionar] Expandir



<?php 
function getPortfolio($feed_url) {

    $content = file_get_contents($feed_url); // get XML string
    $x = new SimpleXmlElement($content); // load XML string into object

    echo '<ul class="portfolio-items clearfix">';
    $i=1; // start count at 1

    // loop through posts
    foreach($x->channel->item as $entry) {

        $content = $entry->description; // get post content
        preg_match('/(<img[^>]+>)/i', $content, $matches); // extract featured image from post description and place in $matches array

        // format portfolio item output
        echo '<li class="portfolio-item">';
        echo '<div><a href="'.$entry->link.'" title="'.$entry->title.'" target="_blank">' . $matches[0] . '</a></div>'; // output first image in $matches array, output link & title
        echo '</li>';

        $i++; // increment counter

        if($i >= 7) // if counter more than 6 - quit
        break;        
    }
    echo "</ul>";
} ?>


de este autor:
http://redvinestudio.com/how-to-read-rss-feeds-with-php-using-simplexml/

y luego dentro de una pagina pongo este codigo con la url del feed

Código (php) [Seleccionar] Expandir

<?php getPortfolio("http://yoururl.com/feed/?post_type=portfolio"); ?>

y me queda asi:


ahora intente agregar codigo CSS para poner las imagenes de forma horizontal

dejando el codigo asi:

imagenes-desde-rss.php

Código (php) [Seleccionar] Expandir


<?php


function my_enqueued_assets() {
        wp_enqueue_style('my-css-file', plugin_dir_url(__FILE__) . '/gal.css', '', time());
}
add_action('wp_enqueue_scripts', 'my_enqueued_assets');

function getPortfolio($feed_url) {

    $content = file_get_contents($feed_url); // get XML string
    $x = new SimpleXmlElement($content); // load XML string into object

    echo '<ul class="portfolio-items clearfix">';
    $i=1; // start count at 1

    // loop through posts
    echo "<ul>";
    foreach($x->channel->item as $entry) {

        $content = $entry->description; // get post content
        preg_match('/(<img[^>]+>)/i', $content, $matches); // extract featured image from post description and place in $matches array

        // format portfolio item output
        echo '<div id="navmenui">';

        echo '<li class="portfolio-item"><a href="'.$entry->link.'" title="'.$entry->title.'" target="_blank">' . $matches[0] . '</a>'; // output first image in $matches array, output link & title
        echo '</li>';

        $i++; // increment counter

        if($i >= 20) // if counter more than 6 - quit
        break;        
    }
    echo "</ul>";
echo "</div>";
} ?>

como ven hice archivo css

Código (php) [Seleccionar] Expandir

function my_enqueued_assets() {
       wp_enqueue_style('my-css-file', plugin_dir_url(__FILE__) . '/gal.css', '', time());
}
add_action('wp_enqueue_scripts', 'my_enqueued_assets');


que trae el siguiente codigo para decir que los los elementos:

gal.css

Código (css) [Seleccionar] Expandir


#navmenui ul {margin: 0; padding: 0;
list-style-type: none; list-style-image: none; }
#navmenui li {display: inline; padding: 5px 20px 5px 20px}

pero alineo las imagenes de forma horizontal


que me falto?

[p4xk3]

Resuelto.

esta usando un mal script en el plugin

para llamar a un archivo css use el siguiente codigo del:

imagenes-desde-rss.php

Código (php) [Seleccionar] Expandir



// css
/**
* Register with hook 'wp_enqueue_scripts', which can be used for front end CSS and javascript
*/
add_action( 'wp_enqueue_scripts', 'prefix_add_my_stylesheet' );

/**
* Enqueue plugin style-file
*/
function prefix_add_my_stylesheet() {
    // Respects SSL, Style.css is relative to the current file
    wp_register_style( 'prefix-style', plugins_url('gal.css', __FILE__) );
    wp_enqueue_style( 'prefix-style' );
}





y para el gal.css el siguiente:

Código (css) [Seleccionar] Expandir




#photos {
  opacity: .88;
}

#photos img {
  width: 30%;
  float: left;
  display: block;
  margin: 2px;
}

ul {
  list-style: none;
  margin: 0px auto;
  padding: 10px;
  display: block;
  max-width: 780px;
  text-align: center;
}

#overlay {
  background: rgba(0,0,0, .8);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  text-align: center;
}

#overlay img {
  margin: 10% auto 0;
  width: 550px;
  border-radius: 5px;
}

#photos {
  width: 100%;
}

#photo-gallery {
  width: 100%;
}





espero que alguien le sirva