WordPress主题开发和Google Font API
问题描述:
I\'m developing a theme and I got this chunk of code which makes a dropdown of google fonts. The dropdown work fine and all, but my problem is that I can seem to make it work in my css.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
function ounox_fonts_setup($wp_customize) { $url = \'https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyDwe8tl4YMbg8asbjzbXDDFuxzR1Wm9EQ0\'; $response = wp_remote_get( \'http://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyDwe8tl4YMbg8asbjzbXDDFuxzR1Wm9EQ0\', array( \'sslverify\' => true ) ); $response = wp_remote_retrieve_body( wp_remote_get($url, array(\'sslverify\' => false ))); if( is_wp_error( $response ) ) { echo \'Something went wrong!\'; } else { $json_a = json_decode($response, true); $font_items = $json_a[\'items\']; $choices = array(); foreach ($font_items as $font_value => $font_item) { $choices[$font_item[\'family\']] = $font_item[\'family\'].\' (Google)\'; } $font_args = array( \'label\' => \'Fonts Section\', \'section\' => \'ounox_fonts_section\', \'settings\' => \'ounox_fonts_display\', \'type\' => \'select\', \'choices\' => $choices ); } $wp_customize->add_section( \'ounox_fonts_section\', array( \'title\' => \'Ounox Fonts\' )); $wp_customize->add_setting( \'ounox_fonts_display\', array( \'transport\' => \'refresh\', )); $wp_customize->add_control( new WP_Customize_Control( $wp_customize, \'ounox_fonts_display_control\', $font_args)); } add_action( \'customize_register\',\'ounox_fonts_setup\' ); |
and also this which applies css to my theme.
1 2 3 4 5 6 7 8 9 10 11 |
function ounox_customize_css() { ?> <style type=\"text/css\"> html, body { font-family: <?php echo get_theme_mod(\'ounox_fonts_display\'); ?>; } </style> <?php } add_action(\'wp_head\', \'ounox_customize_css\'); |
How can I apply the selected font of the user to apply to the CSS? Sorry really bad at backend stuff.
图片转代码服务由CSDN问答提供
感谢您的意见,我们尽快改进~
功能建议
我正在开发一个主题,我得到了一大堆代码,可以下载谷歌字体。 下拉列表工作正常,但我的问题是我似乎可以使它在我的CSS中工作。</ p>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
function ounox_fonts_setup($ wp_customize){ $ url =\'https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyDwe8tl4YMbg8asbjzbXDDFuxzR1Wm9EQ0\'; $ response = wp_remote_get(\'http://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyDwe8tl4YMbg8asbjzbXDDFuxzR1Wm9EQ0 \',array(\'sslverify\'=&gt; true)); $ response = wp_remote_retrieve_body(wp_remote_get($ url,array(\'sslverify\'=&gt; false))); if(is_wp_error($ response) ){ echo\'出错了!\'; } else { $ json_a = json_decode($ response,true); $ font_items = $ json_a [\'items\']; $ choices = array(); foreach($ font_items as $ font_value =&gt; $ font_item){ $ choices [$ font_item [\'family\']] = $ font_item [\'family\']。\' (Google)\'; } $ font_args = array( \'label\'=&gt;\'字体部分\', \'部分\'=&gt;\'ounox_fonts_section\', \'设置\'=&gt; \'ounox_fonts_display\', \'type\'=&gt;\'select\', \'choices\'=&gt; $ choices ); } $ wp_customize-&gt; add_section(\'ounox_fonts_section\',array( \'title\'=&gt;\'Ounox Fonts\' )); $ wp_customize-&gt; add_setting(\'ounox_fonts_display\',array( \'transport\'=&gt;\'refresh\', )) ; $ wp_customize-&gt; add_control(new WP_Customize_Control($ wp_customize,\'ounox_fonts_display_control\',$ font_args)); } add_action(\'customize_register\',\'ounox_fonts_setup\'); </ code> </ pre> <p>以及将css应用于我的主题的内容。</ p> <pre> <code> function ounox_customize_css(){?&gt; &lt; style type =“text / css”&gt; html,body { font-family:&lt;?php echo get_theme_mod(\'ounox_fonts_display\'); ?&gt ;; } &lt; / style&gt; &lt;?php} add_action(\'wp_head\',\'ounox_customize_css\'); </ code> </ pre> <p>如何应用所选的用户字体以应用于CSS? 抱歉,后端的东西非常糟糕。</ p> </ div> <h5>网友观点:</h5> <div> <p>Add below function in functions.php</p> <pre><code>function calling_google_font_script(){ // Getting the set font from options. $temp_font_name = get_theme_mod(\'ounox_fonts_display\'); // Adding Font in Google URL $google_font = esc_url(\'https://fonts.googleapis.com/css?family=\' . $temp_font_name); // Now Calling google font in website wp_enqueue_style( \'google-fonts\', esc_url_raw($google_font), array(), null ); } add_action(\'wp_enqueue_scripts\',\'calling_google_font_script\'); |
由于网站搬家,部分链接失效,如无法下载,请联系站长!谢谢支持!
1. 带 [亲测] 说明源码已经被站长亲测过!
2. 下载后的源码请在24小时内删除,仅供学习用途!
3. 分享目的仅供大家学习和交流,请不要用于商业用途!
4. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
5. 本站所有资源来源于站长上传和网络,如有侵权请邮件联系站长!
6. 没带 [亲测] 代表站长时间紧促,站长会保持每天更新 [亲测] 源码 !
7. 盗版ripro用户购买ripro美化无担保,若设置不成功/不生效我们不支持退款!
8. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
9. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
10.如果您购买了某个产品,而我们还没来得及更新,请联系站长或留言催更,谢谢理解 !
GG资源网 » WordPress主题开发和Google Font API
1. 带 [亲测] 说明源码已经被站长亲测过!
2. 下载后的源码请在24小时内删除,仅供学习用途!
3. 分享目的仅供大家学习和交流,请不要用于商业用途!
4. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
5. 本站所有资源来源于站长上传和网络,如有侵权请邮件联系站长!
6. 没带 [亲测] 代表站长时间紧促,站长会保持每天更新 [亲测] 源码 !
7. 盗版ripro用户购买ripro美化无担保,若设置不成功/不生效我们不支持退款!
8. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
9. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
10.如果您购买了某个产品,而我们还没来得及更新,请联系站长或留言催更,谢谢理解 !
GG资源网 » WordPress主题开发和Google Font API