Community Forums › Forums › Search › Search Results for 'svg'
-
AuthorSearch Results
-
January 8, 2020 at 3:05 pm #495853
Topic: Anyone Using A Sass Starter Theme?
in forum Design Tips and TrickssquidzinkMemberHey folks, I'm Cole. I've just barely put my toe in the Genesis waters. I bought and have set up with the Sample theme on my localhost to investigate if it is my next path after the previous Foundation based starter I had been using went dormant.
My goal is to continue with the general process I had been using, which is custom designs leveraging SASS and partials.
I can't see going back to vanilla CSS.
I am more a designer than developer however. I don't tend to need to do a bunch of custom PHP in most projects. They are more about presentation and the ability of the client to manage content.
I have done some initial research on SASS based versions of the Genesis Sample theme. But they all seem to be a little outdated and not very active, which is worrisome.
So, I have a few questions I'm hoping the community can help me out with:
- Is anyone using what they feel like is a quality SASS starter theme? Or is this just not done because there are other efficiencies that out weigh those of SASS?
- Are most Genesis users buying themes rather than creating custom designs?
- When using vanilla CSS are y'all just adding/customizing the main styles.ccs of your child theme or are you putting custom CSS into the Customizer > Add'l CSS box?
- Aren't there various Page Templates, sidebar, full width that can be used on a page by page basis rather than globally set in Customizer?
- Can you use an SVG logo in Genesis?
- Are y'all focused on leveraging Gutenberg and Atomic Blocks or are some using WPBakery or other visual editors?
- Is anyone using github to manage their customizations?
These all seem like lame questions. Right now, I feel like a fish out of water coming from using a blank Foundation 6 based theme (FoundationPress) and a SASS workflow. FoundationPress was blank in the sense of it has very simple default styles, responsive breakpoints, a built in menu/mobile menu. The Foundation Framework itself provided grids, buttons, typographic scaling, modals, things I could manipulate with SASS but didn't have to "develop" myself, like some other SASS based blank starter themes require. I don't need to develop my own nav walker or default styles or theme from scratch. Thus, Genesis seeming like it might be a path forward.
I'm unfamiliar with a Genesis workflow. Can anyone describe a basic "This is how I normally work" process with Genesis or point me to a good resource that describes a workflow?
December 5, 2019 at 8:37 pm #495294In reply to: Simple Social Icons Output Coding Suggestion
AnitaKeymasterThis question was raised on the Simple Social Icons plugin page. See the response there which states the titles are there for accessibility - https://wordpress.org/support/topic/removing-title-tag-from-icon-svgs/.
Love coffee, chocolate and my Bella!
October 23, 2019 at 1:52 pm #494221AnitaKeymasterThat line code can be found around line 719 of the stylesheet. I'm not sure how to apply an SVG image to that area, but it uses a "height, width and background color" to form that line.
.error404 .site-inner::before, .page .site-inner::before, .single .site-inner::before { background-color: #a86500; content: ""; display: block; height: 100px; margin: 0 auto; position: relative; top: -50px; width: 2px; z-index: 9; }
Love coffee, chocolate and my Bella!
October 16, 2019 at 3:01 pm #494071[Resolved]Topic: Essence Pro: Editing the line element connecting Hero and Body section
in forum Design Tips and TricksleoleosoParticipantHi all,
The Essence Pro theme has an element (A line) that connects the hero section and the body section for must pages in Desktop. You can edit the color of this line when you change the general theme color.
However, is it possible to make this line an SVG instead? Does anyone know how I could edit the code to do so?
Thanks!
-- Leo
September 25, 2019 at 9:57 am #493714[Resolved]Topic: "Hamburger" menu suddenly looks odd – What is affecting it?
in forum Design Tips and TricksilkwebParticipantHi all.
A few days ago I noticed my responsive mobile menu icon (aka "hamburger") started looking odd.
In the narrower viewports, the primary nav changes from text links to the hidden flyout menu hamburger, but the three .svg's (I think they are .svg, possibly .png) are looking as though they are too think or too close together.
Clearly, I have changed something in the stylsheet without realising.
What do you think it could be?
Here's a link to the site in question. If you make your browser narrower you'll see the navigation eventually change to a mobile navigation, and you'll see what I'm talking about.
Naturally, I've had the element inspector open for hours as I try to decipher the issue.
Has this happened to anyone else? What did you do to fix it?
Thanks for reading, and any help is welcomes and appreciated.
Regards,
DarrenSeptember 12, 2019 at 2:42 am #493518In reply to: Simple social icons not displaying in right header
laucocosParticipantHi Anita,
I've unlocked the site so you can access it without a password.
Below is the css code I used to style the social icons for the header:
.site-header .simple-social-icons a svg[class^="social-"] {
color: #ffffff;
}.site-header .simple-social-icons a:hover svg[class^="social-"] {
color: #00539a;
}.front-page .white .site-header .simple-social-icons a svg[class^="social-"],
.white .site-header .simple-social-icons a svg[class^="social-"] {
color: #1f1f1f;
}.front-page .white .site-header .simple-social-icons a:hover svg[class^="social-"] {
color: #00539a;
}Many thanks,
LauraAugust 27, 2019 at 8:09 pm #493230In reply to: Simple Social Icons
AnitaKeymasterIt's like there might be an issue with the SVG images. You should submit a support ticket on the plugin directly here.
Love coffee, chocolate and my Bella!
August 19, 2019 at 2:39 pm #493048In reply to: Fontawesome list icons for unordered lists
milkywayMemberHi Victor,
This possibility didn't even occur to me... 😀
I'm using FontAwesome 5.3.1 on this site. Below is the relevant code from my functions.php:
// Make Font Awesome available add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' ); function enqueue_font_awesome() { wp_enqueue_style( 'font-awesome-free', '/fontawesome-free-5.3.1-web/css/all.css' ); }
In the older project, I had been using 4.7.0 (and included it via maxcdn.bootstrapcdn.com).
Do you happen to know what the family name for the Solid FontAwesome fonts is?
My (vague) guess at this point is that I should have included the @fontface part for the fontawesome font, as I did for my other locally hosted fonts. I didn't need this in my older project and the fontawesome icons within the posts etc are loading fine, too, but maybe this is now required to load them as list icons?
I've tried adding the following to my style.css:
/* fontAwesome Solid */ @font-face { font-family: 'FontAwesomeSolid'; font-style: normal; font-weight: 900; src: url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.eot'); /* IE9 Compat Modes */ src: local('Font Awesome Solid'), local('FontAwesome-Solid'), url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.woff2') format('woff2'), /* Super Modern Browsers */ url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.woff') format('woff'), /* Modern Browsers */ url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.ttf') format('truetype'), /* Safari, Android, iOS */ url('../../../fontawesome-free-5.3.1-web/webfonts/fa-solid-900.svg#FontAwesomeSolid') format('svg'); /* Legacy iOS */ }
And then changed the font-family call in the style.css to
ul.icon li:before { font-family: 'FontAwesomeSolid'; float: left; width: 1.4em; }
but this hasn't solved the problem.
As you might have guessed, my css skills are mediocre at best - I can understand it when I see it (well, most of the time), but piecing it together myself is a different story.
I really appreciate your help!
Milkyway
July 25, 2019 at 5:21 am #492565In reply to: JSON Response Error
Victor FontModeratorWhat kind of image is it, jpg, png, svg, or something else?
What's the http error?
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 17, 2019 at 7:08 am #492401[Resolved]Topic: Attempting to widgetize my theme using functions but site crashing
in forum Design Tips and TricksilkwebParticipantSo, using a basic Genesis function to register a new widget is taking down my site. An error is produced.
This has never happened before as I've registered countless widgets in other themes.
Here's what my functions.php file looks like.
<?php /** * Business Pro Theme * * @package Governance Solutions * @link # * @author Governance Solutions * @copyright Copyright © 2019 * @license GPL-3.0-or-later */ // If this file is called directly, abort.. if ( ! defined( 'WPINC' ) ) { die; } genesis_register_sidebar( array( 'id' => 'new-widget', 'name' => __( 'Custom Widget', 'genesis' ), 'description' => __( 'Custom Widget Area', 'childtheme' ), ) ); //* Defines Clickable Logo and adds Blog Info to title function special_site_logo() {?><a id="sitelogo" href="<?php bloginfo( 'url' ); ?>"><img src="http://localhost/governancesolutionsmulti/wp-content/uploads/logo/web-logo.svg" alt="<?php bloginfo('name')?>" title="<?php bloginfo('name')?>" /></a><?php ; } add_action( 'genesis_site_title','special_site_logo',5,1); // Start the engine (do not remove). include_once get_template_directory() . '/lib/init.php'; // Load setup functions. include_once __DIR__ . '/includes/setup.php'; // Load helper functions. include_once __DIR__ . '/includes/helpers.php'; // Load scripts and styles. include_once __DIR__ . '/includes/enqueue.php'; // Load general functionality. include_once __DIR__ . '/includes/general.php'; // Load hero section. include_once __DIR__ . '/includes/hero.php'; // Load widget areas. include_once __DIR__ . '/includes/widgets.php'; // Load Customizer settings. include_once __DIR__ . '/includes/customize.php'; // Load default settings. include_once __DIR__ . '/includes/defaults.php'; // Load recommended plugins. include_once __DIR__ . '/includes/plugins.php';
The error:
Fatal error: Call to undefined function genesis_register_sidebar() in C:\wamp64-3.0.6\www\governancesolutionsmulti\wp-content\themes\governance-solutions\functions.php on line 23
A screenshot:
May 12, 2019 at 4:48 am #491123ilkwebParticipantHi Anita,
Thanks for your response. I've been comparing my js files from 2015 compared to when the js files of Magazine were updated by StudioPress.
Here's a screenshot comparing them. I can see some are different and wonder if it's safe to simply copy across the new ones to the older folder.
I am running my site in WAMP as a localhost so there's no danger of messing anything up permanently.
Right-click the image below and choose "open image in new tab".
Also, I've compared the "new" and "old" functions.php and notices I'm missing code in my file pertaining to the js for mobile menus.
Here's what I believe I'm missing from my functions.php:
wp_enqueue_script( 'magazine-responsive-menu', get_stylesheet_directory_uri() . '/js/responsive-menus' . $suffix . '.js', array( 'jquery' ), CHILD_THEME_VERSION, true ); wp_localize_script( 'magazine-responsive-menu', 'genesis_responsive_menu', magazine_responsive_menu_settings() ); } // Define our responsive menu settings. function magazine_responsive_menu_settings() { $settings = array( 'mainMenu' => __( 'Menu', 'magazine-pro' ), 'subMenu' => __( 'Submenu', 'magazine-pro' ), 'menuClasses' => array( 'combine' => array( '.nav-primary', '.nav-header', '.nav-secondary', ), ), ); return $settings; }
Here's an entire print out of my functions.php, including my customisations:
<?php //* Start the engine include_once( get_template_directory() . '/lib/init.php' ); //* Set Localization (do not remove) load_child_theme_textdomain( 'magazine', apply_filters( 'child_theme_textdomain', get_stylesheet_directory() . '/languages', 'magazine' ) ); //* Child theme (do not remove) define( 'CHILD_THEME_NAME', __( 'Magazine Pro Theme', 'magazine' ) ); define( 'CHILD_THEME_URL', 'http://my.studiopress.com/themes/magazine/' ); define( 'CHILD_THEME_VERSION', '3.0.1' ); // Enable PHP in widgets add_filter('widget_text','execute_php',100); function execute_php($html){ if(strpos($html,"<"."?php")!==false){ ob_start(); eval("?".">".$html); $html=ob_get_contents(); ob_end_clean(); } return $html; } /** * Add SVG capabilities */ function smallbizgeek_svg_mime_type( $mimes = array() ) { $mimes['svg'] = 'image/svg+xml'; $mimes['svgz'] = 'image/svg+xml'; return $mimes; } add_filter( 'upload_mimes', 'smallbizgeek_svg_mime_type' ); //* Add Shortcode function youtubeilk_function() { return '<div class="g-ytsubscribe" data-channel="ilkestonwebdesign" data-count="default" data-layout="full"></div>'; } add_shortcode('youtubeilk', 'youtubeilk_function'); //* Universally Parse Shortcodes add_filter('widget_text', 'do_shortcode'); //* Add HTML5 markup structure add_theme_support( 'html5' ); //* Run Smilies function through text widget sidebars add_filter( 'widget_text', 'convert_smilies' ); //* Add viewport meta tag for mobile browsers add_theme_support( 'genesis-responsive-viewport' ); //* Add new image sizes add_image_size( 'home-middle', 360, 200, true ); add_image_size( 'home-top', 750, 300, true ); add_image_size( 'sidebar-thumbnail', 100, 100, true ); /** Display related posts in Genesis based on Category */ function related_posts_categories() { if ( is_single ( ) ) { global $post; $count = 0; $postIDs = array( $post->ID ); $related = ''; $cats = wp_get_post_categories( $post->ID ); $catIDs = array( );{ foreach ( $cats as $cat ) { $catIDs[] = $cat; } $args = array( 'category__in' => $catIDs, 'post__not_in' => $postIDs, 'showposts' => 3, 'ignore_sticky_posts' => 1, 'orderby' => 'rand', 'tax_query' => array( array( 'taxonomy' => 'post_format', 'field' => 'slug', 'terms' => array( 'post-format-link', 'post-format-status', 'post-format-aside', 'post-format-quote' ), 'operator' => 'NOT IN' ) ) ); $cat_query = new WP_Query( $args ); if ( $cat_query->have_posts() ) { while ( $cat_query->have_posts() ) { $cat_query->the_post(); $related .= '<li><a href="' . get_permalink() . '" rel="bookmark" title="Permanent Link to' . get_the_title() . '">' . get_the_title() . '</a></li>'; } } } if ( $related ) { printf( '<div class="related-posts"><h3>Related Posts</h3><ul>%s</ul></div>', $related ); } wp_reset_query(); } } add_action( 'genesis_after_entry_content', 'related_posts_categories' ); //* Add support for additional color styles add_theme_support( 'genesis-style-selector', array( 'magazine-pro-blue' => __( 'Magazine Pro Blue', 'magazine' ), 'magazine-pro-green' => __( 'Magazine Pro Green', 'magazine' ), 'magazine-pro-orange' => __( 'Magazine Pro Orange', 'magazine' ), ) ); //* Add support for custom header add_theme_support( 'custom-header', array( 'default-text-color' => '000000', 'header-selector' => '.site-title a', 'header-text' => false, 'height' => 172, 'width' => 380, ) ); //* Reposition the primary navigation menu remove_action( 'genesis_after_header', 'genesis_do_nav' ); add_action( 'genesis_before_header', 'genesis_do_nav' ); //* Add primary-nav class if primary navigation is used add_filter( 'body_class', 'backcountry_no_nav_class' ); function backcountry_no_nav_class( $classes ) { $menu_locations = get_theme_mod( 'nav_menu_locations' ); if ( ! empty( $menu_locations['primary'] ) ) { $classes[] = 'primary-nav'; } return $classes; } //* Customize search form input box text add_filter( 'genesis_search_text', 'magazine_search_text' ); function magazine_search_text( $text ) { return esc_attr( __( 'Search the site ...', 'magazine' ) ); } //* Customize search form input box text add_filter( 'genesis_search_text', 'sp_search_text' ); function sp_search_text( $text ) { return esc_attr( 'Search...' ); } //* Modify the size of the Gravatar in the author box add_filter( 'genesis_author_box_gravatar_size', 'magazine_author_box_gravatar' ); function magazine_author_box_gravatar( $size ) { return 140; } // Allow HTML in author bio section remove_filter('pre_user_description', 'wp_filter_kses'); //Add sanitization for WordPress posts add_filter( 'pre_user_description', 'wp_filter_post_kses'); //* Modify the size of the Gravatar in the entry comments add_filter( 'genesis_comment_list_args', 'magazine_comments_gravatar' ); function magazine_comments_gravatar( $args ) { $args['avatar_size'] = 100; return $args; } //* Remove entry meta in entry footer add_action( 'genesis_before_entry', 'magazine_remove_entry_meta' ); function magazine_remove_entry_meta() { //* Remove if not single post if ( ! is_single() ) { remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_open', 5 ); remove_action( 'genesis_entry_footer', 'genesis_post_meta' ); remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_close', 15 ); } } //* Hooks after-entry widget area to single posts add_action( 'genesis_entry_footer', 'magazine_after_entry_widget' ); function magazine_after_entry_widget() { if ( ! is_singular( 'post' ) ) return; genesis_widget_area( 'after-entry', array( 'before' => '<div class="after-entry widget-area"><div class="wrap">', 'after' => '</div></div>', ) ); } //* Remove comment form allowed tags add_filter( 'comment_form_defaults', 'magazine_remove_comment_form_allowed_tags' ); function magazine_remove_comment_form_allowed_tags( $defaults ) { $defaults['comment_notes_after'] = ''; return $defaults; } //* Add support for 3-column footer widgets add_theme_support( 'genesis-footer-widgets', 3 ); //* Register widget areas genesis_register_sidebar( array( 'id' => 'home-top', 'name' => __( 'Home - Top', 'magazine' ), 'description' => __( 'This is the top section of the homepage.', 'magazine' ), ) ); genesis_register_sidebar( array( 'id' => 'home-middle', 'name' => __( 'Home - Middle', 'magazine' ), 'description' => __( 'This is the middle section of the homepage.', 'magazine' ), ) ); genesis_register_sidebar( array( 'id' => 'home-bottom', 'name' => __( 'Home - Bottom', 'magazine' ), 'description' => __( 'This is the bottom section of the homepage.', 'magazine' ), ) ); genesis_register_sidebar( array( 'id' => 'after-entry', 'name' => __( 'After Entry', 'magazine' ), 'description' => __( 'This is the after entry section.', 'magazine' ), ) ); //Register WP Meet Up Header Right function cgp_extra_widgets() { genesis_register_sidebar( array( 'id' => 'wp-meet-up-header', 'name' => __( 'WP Meet Up Header Right', 'genesischild' ), 'description' => __( 'This is the WP Header Right', 'genesischild' ), ) ); } add_action( 'widgets_init', 'cgp_extra_widgets' ); function cgp_add_second_header_right() { if (is_page('4798') ) { remove_action( 'genesis_header', 'genesis_do_header' ); add_action( 'genesis_header', 'cgp_special_header' ); } function cgp_special_header() { //WP Meet Up Header Right genesis_markup( array( 'html5' => '<div %s>', 'xhtml' => '<div id="title-area">', 'context' => 'title-area', ) ); do_action( 'genesis_site_title' ); do_action( 'genesis_site_description' ); echo '</div>'; genesis_markup( array( 'html5' => '<aside %s>', 'xhtml' => '<div class="widget-area header-widget-area">', 'context' => 'header-widget-area', ) ); do_action( 'genesis_header_right' ); add_filter( 'wp_nav_menu_args', 'genesis_header_menu_args' ); add_filter( 'wp_nav_menu', 'genesis_header_menu_wrap' ); dynamic_sidebar( 'wp-meet-up-header' ); remove_filter( 'wp_nav_menu_args', 'genesis_header_menu_args' ); remove_filter( 'wp_nav_menu', 'genesis_header_menu_wrap' ); genesis_markup( array( 'html5' => '</aside>', 'xhtml' => '</div>', ) ); } } add_action('get_header', 'cgp_add_second_header_right'); /** Register Widget Area */ genesis_register_sidebar( array( 'id' => 'banners-1', 'name' => __( 'Email Subscribe Posts', 'mp' ), 'description' => __( 'Visible on single posts before comments', 'mp' ), ) ); genesis_register_sidebar( array( 'id' => 'banners-4', 'name' => __( 'HomePage Widget - Featured Stories', 'mp' ), 'description' => __( 'Only visible on front page.', 'mp' ), ) ); genesis_register_sidebar( array( 'id' => 'banners-2', 'name' => __( 'HomePage Widget', 'mp' ), 'description' => __( 'Only visible on front page.', 'mp' ), ) ); genesis_register_sidebar( array( 'id' => 'banners-3', 'name' => __( 'Email Subscribe Pages', 'mp' ), 'description' => __( 'Visible on single pages at bottom', 'mp' ), ) ); /** Add Widget Area */ add_action( 'genesis_before_comments', 'banner_widget_one' ); function banner_widget_one() { if ( is_single() ) { genesis_widget_area( 'banners-1', array( 'before' => '<div class="widget-area subscribe">', 'after' => '</div>', ) ); } } add_action( 'genesis_after_entry', 'banner_widget_four' ); function banner_widget_four() { if ( ( is_page(array('1109')) ) ) { genesis_widget_area( 'banners-4', array( 'before' => '<div class="widget-area homepage">', 'after' => '</div>', ) ); } } add_action( 'genesis_after_entry', 'banner_widget_two' ); function banner_widget_two() { if ( ( is_page(array('1109')) ) ) { genesis_widget_area( 'banners-2', array( 'before' => '<div class="widget-area homepage">', 'after' => '</div>', ) ); } } add_action( 'genesis_after_entry', 'banner_widget_three' ); function banner_widget_three() { if ( is_page() ) { genesis_widget_area( 'banners-3', array( 'before' => '<div class="widget-area subscribe">', 'after' => '</div>', ) ); } } //* Create a custom Gravatar add_filter( 'avatar_defaults', 'sp_custom_gravatar' ); function sp_custom_gravatar ($avatar) { $custom_avatar = get_stylesheet_directory_uri() . '/images/custom-gravatar.jpg'; $avatar[$custom_avatar] = "Custom Gravatar"; return $avatar; } //* Reposition the breadcrumbs remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' ); add_action( 'genesis_entry_header', 'genesis_do_breadcrumbs' ); //* Defines Clickable Logo and adds Blog Info to title function special_site_logo() {?><a id="sitelogo" href="<?php bloginfo( 'url' ); ?>"><img src="http://localhost/smallbizgeeklocal/wp-content/uploads/2014/images/logo.svg" width="145" alt="<?php bloginfo('name')?>" title="<?php bloginfo('name')?>" /></a><?php ; } add_action( 'genesis_site_title','special_site_logo',5,1); //* Defines Clickable Logo and adds Blog Info to title function wp_site_logo() { //* Show if WP meetup page if ( is_page('4798') ) { echo '<a id="sitelogo1" href=""><img src="http://localhost/smallbizgeeklocal/wp-content/uploads/2014/images/wp-logo.svg" style="margin:0 18px 0px 18px; height:134px;" width="100" height="170" alt="WordPress map pin" title="WordPress Meetup in Derby & Nottingham" /></a>';} } add_action( 'genesis_site_title','wp_site_logo',5,1); //* Add Social Buttons sharing shortcode function get_sharing() { return ' <div class="fbshare"> <div class="fb-share-button" data-type="button_count"></div> </div> <div class="googleplusshare"> <div class="g-plusone" data-annotation="bubble" data-width="120"></div> </div> <div class="linkedinshare"> <script type="IN/Share" data-counter="right"></script> </div> <div class="twittershare"> <a href="https://twitter.com/share" class="twitter-share-button" data-via="SmallBizGeekUK">Tweet</a> </div>'; } add_shortcode('sharing', 'get_sharing'); //* Add content seperator div shortcode function get_seperator() { return '<div class="border-line"> </div>'; } add_shortcode('seperator', 'get_seperator'); //* Modify the speak your mind title in comments add_filter( 'comment_form_defaults', 'sp_comment_form_defaults' ); function sp_comment_form_defaults( $defaults ) { $defaults['title_reply'] = __( 'Add Your Thoughts' ); return $defaults; } //* Modify the text before comments section add_filter( 'comment_form_defaults', 'cd_pre_comment_text' ); /** * Change the text output that appears before the comment form * Note: Logged in user will not see this text. * * @author Carrie Dils <http://www.carriedils.com> * @uses comment_notes_before <http://codex.wordpress.org/Function_Reference/comment_form> * */ function cd_pre_comment_text( $arg ) { $arg['comment_notes_before'] = "Your email address is safe and will NOT be shared with anyone else. <br><br>Hateful, spammy or abusive comments will not be tolerated. <br><br>For more information please see the <a href='http://www.smallbizgeek.co.uk/darren/comment-policy/' target='_blank' >comment policy</a>.<br><br>"; return $arg; }
I've submitted this thread to StudioPress support.
May 11, 2019 at 5:28 am #491100Victor FontModeratorTry adding the !important keyword to your code. You're code is probably being placed first in the inline styles and it's being overridden by the embedded style.
#mc_embed_signup { background: #dcdcdc !important; }
When I was looking at your source code, you have multiple h1 tags on the page. This is very bad for SEO and accessibility. There should only be 1 h1 tag on a page. All of your social media icons are wrapped in an h1. Not only that, but the code is wrong and causing errors.
This is your code:
<h1 class="wp-svg-bubbles-2 bubbles-2"style="color:#808080;">
There's no space between the class and additional style. This is the corrected code:
<h1 class="wp-svg-bubbles-2 bubbles-2" style="color:#808080;">
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 23, 2019 at 1:20 pm #490824In reply to: Dimensions of background image for News Pro
Victor FontModeratorYou can't calculate the side margins the way you want to because every computer has different dimensions. I'm running a MacBook Pro. The screen width is 2880x1800. If I use my Windows 10 laptop, the screen dimensions are 2560x1440.
If I were you, I would use a .svg image as the background and set the background-size to cover. This way the browser automatically adjusts for the width of the screen no matter what computer you're on.
Based on you last question, if a screen's viewport is 1920x, the side margins are (1920 - 1140) / 2 = 390 on each side. If you want to make an equation out of it, you can use the CSS calc() function. calc( ( 100vw - 1140px ) / 2 )
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 1, 2019 at 2:53 pm #490427In reply to: Simple Social Icons – Icon's Not Showing Up
Victor FontModeratorI would reinstall the plugin. It looks like a faulty install. The icons are not being found. It could also be a permissions issue or the server may not allow svg images. In which case, these would be server issues and you'd have to contact your host.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 1, 2019 at 2:09 pm #490425Topic: Simple Social Icons – Icon's Not Showing Up
in forum General Discussion[email protected]MemberI'm using Genesis theme (and geneses child theme) with Simple Social Icons plugin. The icons loctaed in the footer aren't showing up.
I'm getting the following console errors:
/wp-content/plugins/simple-social-icons/symbol-defs.svg#social-facebook:1 Failed to load resource: the server responded with a status of 404 (Not Found)
/wp-content/plugins/simple-social-icons/symbol-defs.svg:1 Failed to load resource: the server responded with a status of 404 (Not Found)
laventanew.com/wp-content/uploads/2019/01/favicon.png:1 Failed to load resource: net::ERR_CONNECTION_RESET
Your help would be appreciated, thanks!
January 31, 2019 at 4:20 pm #489185In reply to: Header Image not responsive
UmpquaWebParticipantThe image was already a jpg, and not the quality I would have liked. Hopefully that will get changed out soon. I'm not sure how to even get an SVG image, but I'm hearing more and more that that is the way to go.
Please help me with the logic behind using width 100%. Doesn't that mean it would still be 500px no matter what?
Adding your code works great for cell phone and of course large screen. But I have a second monitor that is 19" and while the logo no longer overlaps the menu bar (the bar drops down), the logo and menu are not side by side. I would ideally like to make the image smaller so they do fit side by side. Is that unrealistic? Does it look weird?
January 31, 2019 at 2:30 pm #489183In reply to: Header Image not responsive
Victor FontModeratorIf you want to make the image scalable at all screen sizes, change the .header-image .title-area class and add a max-width to it and change the width to 100% at line 1376 in style.css:
.header-image .title-area { margin: 0; max-width: 500px; width: 100%; }
Next do the same for the .header-image .site-title > a around line 1367:
.header-image .site-title > a { background-position: center center !important; background-size: contain !important; float: left; min-height: 70px; max-width: 500px; width: 100%; }
As an FYI, I wouldn't have used a jpg for a text image. I would use a svg image. Using a SVG means the text will remain crystal clear at any size. Using the jpg will render the text fuzzy.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?January 28, 2019 at 7:32 am #489080Victor FontModeratorThis is the only plugin I use for SVG: https://wordpress.org/plugins/svg-support/
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?January 28, 2019 at 7:27 am #489079YumeiParticipantThanks for the explanation and the example htaccess code.
The svg image comes with the theme (Breakthrough Pro)-I certainly didn't upload the file. So that's puzzlement #1.
#2: The svg image in question is indeed small-so I thought the error message lumped in with compression errors (all of them are small, <0.5k) might have other issues, such as needing a plugin for svg. But that doesn't make sense either.
I would love to use svg images on websites, tried a few plugins in the past. Which one(s) do you use?
January 28, 2019 at 7:02 am #489077Victor FontModeratorYou need a plugin to add SVG images to the media library, not to display SVG images on a site. SVG is a modern image technology called vector graphics. Rather than using pixels to construct the details of the images, SVG uses math to scale images so they remain crystal clear at any resolution. When you scale a jpg or png, they become pixelated and look fuzzy as you enlarge them.
SVGs are superior to jpg and png in size, quality, and scalability. I use them almost completely on my sites now, only using jop or png when I have no other choice.
The error you are seeing has nothing to do with compression. The arrow images for the hero section of Breakthrough Pro are less than 2k is size. How much do you want to compress an image that is 1,047 bytes?
This error: (expiration not specified), has to do with not specifying an expiration date for the svg+xml type so the server can provide instructions to the browser for for better cache control. The Expires headers are sent to the browser by Apache, your web server.
If you are using a caching plugin, this is something that you may be able to set yourself. You can also set this your self by editing your site's htaccess file, but if you've never done, as your host for help otherwise you can easily cause you website to crash.
On my server, this is what I use in my htaccess for the Expires Headers:
# Expires headers (for better cache control) <IfModule mod_expires.c> ExpiresActive on # Perhaps better to whitelist expires rules? Perhaps. ExpiresDefault "access plus 1 month" # cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5) ExpiresByType text/cache-manifest "access plus 0 seconds" # Your document html ExpiresByType text/html "access plus 0 seconds" # Data ExpiresByType text/xml "access plus 0 seconds" ExpiresByType application/xml "access plus 0 seconds" ExpiresByType application/json "access plus 0 seconds" # Feed ExpiresByType application/rss+xml "access plus 1 hour" ExpiresByType application/atom+xml "access plus 1 hour" # Favicon (cannot be renamed) ExpiresByType image/x-icon "access plus 1 week" # Media: images, video, audio ExpiresByType image/gif "access plus 4 months" ExpiresByType image/png "access plus 4 months" ExpiresByType image/jpeg "access plus 4 months" ExpiresByType image/webp "access plus 4 months" ExpiresByType video/ogg "access plus 1 month" ExpiresByType audio/ogg "access plus 1 month" ExpiresByType video/mp4 "access plus 1 month" ExpiresByType video/webm "access plus 1 month" # HTC files (css3pie) ExpiresByType text/x-component "access plus 1 month" # Webfonts ExpiresByType application/x-font-ttf "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" ExpiresByType application/x-font-woff2 "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" ExpiresByType application/vnd.ms-fontobject "access plus 1 month" # CSS and JavaScript ExpiresByType text/css "access plus 1 year" ExpiresByType application/javascript "access plus 1 year" </IfModule>
This code is meant as an example only. DO NOT copy and paste it into your htaccess unless you know exactly what to do. You will crash your site.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet? -
AuthorSearch Results