pagina - wordpress title tag

¿Cómo agregar todas las opciones de fondo con el árbol de opciones en el tema de WordPress?

Question

Soy relativamente nuevo en el desarrollo de temas de WordPress, y tuve que crear un tema con árbol de opciones. He agregado con éxito algunas opciones con el plugin de árbol de opciones en mi tema de WordPress. Pero realmente estoy de pie cuando voy a agregar la opción Fondo. Tengo una sección completa de opciones de configuración en el tema con ''tipo'' => ''fondo'', después de ver que he encontrado algunas opciones en los tableros de opciones del tema como ''seleccionar color'', ''background-repeat'', '''' background-attachment '', ''posición de fondo'' y tamaño de fondo. Ahora quiero consultar todos los métodos pero no sé cómo puedo hacer esto. exactamente quiero hacer dinámico este cuerpo del código {fondo: url (desde el árbol de opciones adjuntar archivo) opción árbol repetir opción desplazarse opciones árbol posición opciones árbol fondo tamaño opciones árbol color}

este es el cuerpo exacto de css {background: url (img / body_bg.png) no-repeat scroll 0 0 # ddd}. Cualquiera Por favor, ayúdenme.

Answer 1

entonces primero tienes que crear una opción para fondo .....

entonces puedes mostrar la opción usando el siguiente código ...

cuerpo {color de fondo:; repetición de fondo :; background-attachment :; posición de fondo :; background-image: url (); }

De hecho, cuando creas una opción de fondo genera una matriz y necesitas tener todos los datos por separado. También mejoré el código anterior en una función de PHP. Por favor échale un vistazo también .....

// A function that will create css for background options  
function WpmBgColor( $wpm_options, $wpm_class, $identifier){ 
    $wpm_options = ot_get_option( $wpm_options, array() );  
    if($wpm_options[''background-color''] | $wpm_options[''background-repeat''] | $wpm_options[''background-attachment''] | $wpm_options[''background-position''] | $wpm_options[''background-image''] ){ echo 
        $identifier.$wpm_class . "{ 
        background-color: ".$wpm_options[''background-color'']."; 
        background-repeat:".$wpm_options[''background-repeat'']."; 
        background-attachment:".$wpm_options[''background-attachment'']."; 
        background-position:".$wpm_options[''background-position'']."; 
        background-image:url(".$wpm_options[''background-image''].") ; 
        background-size:".$wpm_options[''background-size'']."; 
        } ";   
    } 
} 

Esta función tiene varios argumentos ...

$ wpm_options: será su opción tree id del campo $ wpm_class: su nombre de selector css para el cual está agregando css $ identifier: su identificador de selector css ya sea una clase o id. Simplemente ponga # cuando es id y ponga "." Cuando es una clase. Y déjelo en blanco cuando sea una etiqueta HTML. Como para el cuerpo, puedes dejarlo vacío.

PM mí si necesita más aclaración. Gracias Sabbir

Answer 2

Puedes probar algo como esto ...

<?php $bg_body = ot_get_option( ''bg_body'', array() ); ?> 
body
{ 
background-color: <?php if($bg_body[''background-color'']){echo $bg_body[''background-color''] ; }else{ echo ''#ffffff'';} ?>;
background-repeat:<?php if($bg_body[''background-repeat'']){echo $bg_body[''background-repeat''] ; }else{ echo ''repeat-x'';} ?>;
background-attachment:<?php if($bg_body[''background-attachment'']){echo $bg_body[''background-attachment''] ; }else{ echo ''fixed'';} ?>;
background-position:<?php if($bg_body[''background-position'']){echo $bg_body[''background-position''] ; }else{ echo ''top'';} ?>;
background-image:url(<?php if($bg_body[''background-image'']){echo $bg_body[''background-image''] ; }else{ echo get_template_directory_uri().''/images/bg.png'';} ?>) ;
}

Yo personalmente uso esto para mis temas premium. www.wpmania.net

Answer 3

La gente me pregunta cómo usar la opción de fondo para betabox (OptionTree Metabox) .....

En primer lugar, debe escribir los siguientes códigos dentro del ciclo. De lo contrario, podría no funcionar ...

<?php
$MyBg= get_post_meta($post->ID, ''option_tree_meta_value'', false);
$MyBg = $MyBg[''0''];
?>

<style type="text/css">
<!-- 
.css_selector
{ 
background-color: <?php if($MyBg[''background-color'']){echo $MyBg[''background-color''] ; }else{ echo ''#ffffff'';} ?>;
background-repeat:<?php if($MyBg[''background-repeat'']){echo $MyBg[''background-repeat''] ; }else{ echo ''repeat-x'';} ?>;
background-attachment:<?php if($MyBg[''background-attachment'']){echo $MyBg[''background-attachment''] ; }else{ echo ''fixed'';} ?>;
background-position:<?php if($MyBg[''background-position'']){echo $MyBg[''background-position''] ; }else{ echo ''top'';} ?>;
background-image:url(<?php if($MyBg[''background-image'']){echo $MyBg[''background-image''] ; }else{ echo get_template_directory_uri().''/images/bg.png'';} ?>) ;
}
-->
</style>

Si aún necesitas más ayuda solo PM. Debo contactarte cuando tenga algo de tiempo.

Answer 4

@ wpmania.net

Actualmente estoy usando la función de estilo en línea de wordpress para agregar el css a las publicaciones y páginas después de cargar mi hoja de estilo principal. Usando las metaboxes del árbol de opciones ofc.

    // Inline style for post/page backgrounds
if ( is_single() || is_page() ) {
    $background = get_post_meta( get_the_ID(), ''my_post_background_metabox'', true );
    if ( !empty( $background ) ) {
        $background_color       = ( $background[''background-color''] != '''' ) ? $background[''background-color''] . '' '' : '''';
        $background_image       = ( $background[''background-image''] != '''' ) ? ''url(''.$background[''background-image''].'') '' : '''';
        $background_repeat      = ( $background[''background-repeat''] != '''' ) ? $background[''background-repeat'']. '' '' : '''';
        $background_positon     = ( $background[''background-position''] != '''' ) ? $background[''background-position'']. '' '' : '''';
        $background_attachment  = ( $background[''background-attachment''] != '''' ) ? $background[''background-attachment'']. '' '' : '''';
        $background_size        = ( $background[''background-size''] != '''' ) ? ''background-size: ''. $background[''background-size'']. '';'' : '''';
        $custom_post_background = 
            ''/* Custom Background for '' . get_the_title() . '' */'' . "/n" .
            ''.css_selector { background: ''.$background_color.$background_image.$background_repeat.$background_attachment.$background_positon.'';''."/n". $background_size .''}'';
        wp_add_inline_style( ''my_theme_style'', $custom_post_background );
    }
}

EDITAR: Olvidé mencionar que esta parte del código está dentro de la función wp_enqueue_script principal