Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

BleedingEdge

Members
  • Joined

  • Last visited

Everything posted by BleedingEdge

  1. Hi guys, I'm trying to find the name or artist of a painting which was apparently very popular in the UK in the 70s (I'm a child of the 80s myself ). It is of blue horses running through water, and is apparently quite naff, although incredibly popular at the time (one of those ones that "everybody" had on their wall...). Any help much appreciated! Thanks, Martin
  2. Hi guys, I'm getting really confused with implementing the facebook like button and the opengraph meta tags on my site, and would really appreciate some guidance. Sorry for the long post, I have bolded the specific questions in it. The way my site is set up (only taking FB into account - the other social plugins are all fine) is that in the sidebar has a like button for the whole site, but there is also a like button for each post (below each teaser on the home and archive (cat/tag/author/etc.) pages. So! I have just below the closing </body> tag: <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=my_app_id_is_here&xfbml=1"></script> And then in the sidebar: <fb:like href="http://www.mywebsite.com" send="true" layout="button_count" width="170" show_faces="true" font=""></fb:like> All fine. In the template for each post teaser I have: <fb:like href="<?php echo $share_url; ?>" send="false" layout="box_count" width="70" show_faces="true" font=""></fb:like> Again, all fine ($share_url is a custom variable with the permalink in - all good and working). So... Good so far. Yesterday I came across the open graph settings for facebook. One of the things that is giving me concern is the quote from the facebook developers pages: I have potentially up to 6 'like' buttons on a page (1 for the site, and 5 for the posts - I have 5 per posts per page). Will they ALL take on the og:url value, whatever the href="" setting of the like button?? That seems rather strange if true... Also, implementing open graph. Why would I want to set up a FB 'app'? What is the benefit of that rather than just using my fb admin ID? I'm slightly confused as to how it all links-in (no pun intended!). I have: - My own personal FB page - A 'page' for my company - and now, it seems, my website will be acting as a 'page' as well. Is this correct?! Finally, I did implement open graph, then went to 'like' my website, and it was as if I was only liking a normal link (no site logo used which I had in the og:image tag, and it didn't show up on my list of interests). Does it take time to propegate through the system? Many thanks for any help, and sorry for the rambling email! All best, Martin
  3. Not at the moment (still putting them together), but I would say that they headings vary from about 300x350px to 700x250px etc, some left aligned, some right, some more random...
  4. Hi mteam, Thanks. I missed your post as I was typing mine! Yes, I would have done exactly that or display:none on a span inside h1, but the heading size varies per page (and there are 20 or so pages), and the p would have to be the same, as well as the containing div background image. So that's 3 elements per page needing both CSS a) dimensioning (width and height), and positioning (every heading, deck, and background is positioned differently per page), which is 60 over the whole site. Which amounts to a lot of CSS code... M
  5. Sure. I'm basing the design on the Vanilla Joomla template by YooTheme (I know, I know... In an ideal world I would have got my head around EE and designed my own site, but a) I'm a (busy) musician above all and I just need a site up and running. A redesign can come at a later stage by a pro who does this for a living when I actually have some disposable income!). Usual caveats from an amateur apply - the screenshots are low quality (20% quality jpegs) for file size. Everything (especially the site logo!) is only roughed out at the moment etc. etc. (basically, please don't mock my design just yet because it's only just started ). In the second shot, I have just got the 3 elements - heading 1 ("Hello! My name is Martin"), the background image (the cartoon) and the 'deck' paragraph ("Placeholder text etc..."). Because of font embedding licensing restrictions, as well as design, the two text elements have to be rendered as images. Basically, do I split the elements into 3 and position them separately using CSS (which, given that the theme - bg, h1, and deck - are different on each page will be a lot of CSS code), or just have a single 930x380px image as the background image of the div with the actual <h1> and <p> tags in the div set to display:none (which can be a single stylesheet entry which covers all pages)? Thanks! M
  6. Hi guys, I have set up a (relatively - for me!) complicated header for my site, which involves a background image, a heading (h1) and a 'deck' (to use newspaper parlance) - a paragraph of introductory text. Using the following code: <div id="top-heading"> <h1>Heading 1 Here</p> <p>Deck text goes here.</p> </div> The "top-heading" div is a fixed width and height (930x380px). I have thought about 2 ways to achieve what I want to. The easier I present second, but it somehow feels like a cheat - I'm just not sure why! First Method Using CSS, style both h1 and p as a block with the specific width and height of the heading image and deck text image, and assign the div, h1, and p a background image. Position them with CSS. Then within <h1> and <p> put the text in a <span> and style the .top-heading h1 span and .top-heading p span to display:none; <div id="top-heading"> <h1><span>Heading 1 Here</span></p> <p><span>Deck text goes here.</span></p> </div> Second (and easier) Method Simply create an image 930x380px with the heading, bg image, and deck text, and assign it as a background to the div. Then set .top-heading h1 and .top-heading p to display:none; Using the second method, I don't need to set the height and width of each particular element, and I also don't have to position each element separately. The second way is far easier (and less code-heavy), but it still feels like a cheat... The result is identical - visually with CSS, and also with no stylesheet applied, when both h1 and p are shown as text. (incidentally, experimentation shows that the overall file size is smaller with the second method too...) Thoughts on best practice appreciated! Thanks, Martin
  7. Hi guys, I am attempting to set up a development LAMP server in VMWare (up to now I've been using WAMP on my development machine, and there have been some inconsistencies when transferring to my hosting provider's Linux servers). I am a TOTAL Linux newbie. The command line scares me... So, I have downloaded CentOS (for no reason other than it is the server my hosting provider - Fasthosts - uses). My development machine has NO internet connection, so I can't download updates directly onto the machine from repositories (a pain, but having no 'net on it is non-negotiable - it's dual booted with my music production workstation, and I never let that go near an internet connection...). What I would really like to do, for my own peace of mind (and learning!), is to download the distributions of Apache, PHP, MySQL, Perl, an FTP server etc. manually and install them, rather than relying on packages like XAMPP which, whilst great, give me NO idea of how to actually set up servers... But, I would like to do this in GNOME Terminal (or KDE) and emacs, not from the command line. I'm still a newbie, remember? And I like GUIs So, first and foremost, what versions do I use? Am I right in thinking that CentOS, being a RHEL downstream distro, relies on RPMs? So do I download the RPM versions of the server software? Many thanks, Martin
  8. Thank you very much! Think I'm beginning to get the hang of it now.
  9. Hi guys, I'm newish to all this and have been messing around with CodeIgniter (and, to a lesser extent, ExpressionEngine). I have a class extending a class: <?php class Homepage extends MY_Controller ?> I set variables in Homepage: <?php protected $page_id = 'home'; // Page reference ID protected $page_title = 'Home'; // Page title for <title> tag protected $parent_id = ''; // Parent page ID if child (null if page is parent) protected $parent_title = ''; // Parent page title if child (null if page is parent) protected $h1_text = "Heading 1 Here"; // Text used for <h1> with CSS turned off protected $page_color = '#0d507a'; // Page colour scheme protected $bg_position = '560px 0px'; // Background image CSS position protected $h1_margins = '30px 0px 40px 0px'; // <h1> image CSS position protected $meta_description = 'Description'; // Meta description protected $meta_keywords = 'Keywords'; // Meta keywords protected $meta_robots = 'INDEX,FOLLOW'; // Meta robots ?> and assign them to an array $pagevars in MY_Controller (the parent controller). $pagevars is then one of the params in a view load from Homepage (still with me?! Not too sure I am myself... ). MY_Controller <?php $this->pagevars['site_name'] = $this->site_name; $this->pagevars['base'] = $this->base; $this->pagevars['idx_page'] = $this->idx_page; $this->pagevars['assets'] = $this->assets; $this->pagevars['page_id'] = $this->page_id; $this->pagevars['page_title'] = $this->page_title; $this->pagevars['parent_id'] = $this->parent_id; $this->pagevars['page_crumb_trail'] = $this->page_crumb_trail; $this->pagevars['h1_text'] = $this->h1_text; $this->pagevars['page_color'] = $this->page_color; $this->pagevars['bg_position'] = $this->bg_position; $this->pagevars['h1_css_size'] = $this->h1_css_size; $this->pagevars['h1_margins'] = $this->h1_margins; $this->pagevars['meta_description'] = $this->meta_description; $this->pagevars['meta_keywords'] = $this->meta_keywords; $this->pagevars['meta_robots'] = $this->meta_robots; ?> Homepage <?php $this->load->view('viewname', $this->pagevars); ?> And it works! Awesome. BUT, I habe no idea what the $this-> is all about as part of the variables. It seems necessary for one 'file' to call 'another' (or for inter-class communication), but I can't find a decent explanation as to why. Any help appreciated! Many thanks, Martin
  10. Thanks Jock. @asek - yeah, I looked at all the CI files and have started putting <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed'); ?> in the header of all my files. As of CodeIgniter 2.0, the application directory is outside the system directory by default as well, so I guess it's best practice to put both outside htdocs. M
  11. Hi guys, In codeigniter, is it necessary to block access to files (views, controllers etc.) you create using define('VariableHere', TRUE); and if(!defined('VariableHere'){die('Direct access not permitted');} (or .htaccess or similar etc etc.), or does CI automatically handle this? Cheers! Martin
  12. Thanks. I may just go with a relative path. No joy with setting the parsing to input either. Thanks for the reading material!
  13. I did think about that, but I thought it might overcomplicate things - each template is a different 'design' anyway, so separate template files have to exist. Keeping the variables in the header of the template file keeps everything is in one place. There are only 8 different templates anyway. I'm using weblogs for news, downloads, and resources (a links directory).
  14. Hi guys, I have found some strange behaviour with the ExpressionEngine {site_url} variable when used in PHP. Using custom variables in PHP woks fine, but {site_url} doesn't want to play nice. This doesn't work: <?php // Get the width and height of the h1 image for image replacement $h1_size = getimagesize("{site_url}img/pages/{embed:page_id}-h1.png"); ?> Whereas this, oddly, does! {assign_variable:website_root="http://localhost/"} <?php // Get the width and height of the h1 image for image replacement $h1_size = getimagesize("{website_root}img/pages/{embed:page_id}-h1.png"); ?> Also, assigning website_root to equal {site_url} also doesn't work, which makes me think that there is something strange being output from {site_url}. {site_url} works perfectly everywhere else in the site! Any help appreciated. Many thanks, Martin
  15. Thanks! I didn't want to use global variables because I wanted to use variables to trigger certain behaviours depending on the template. At the top of each template file I have: {!-- Website root URL --} {assign_variable:website_root="http://localhost/site/"} {!-- Internal reference ID of page --} {assign_variable:page_id="home"} {!-- Page title --} {assign_variable:page_title="Home"} {!-- Page heading (text used for <h1> tag) --} {assign_variable:page_heading="This is a Heading"} {!-- Page colour (used for background and links etc.) --} {assign_variable:page_color="#0d507a"} {!-- Page META description --} {assign_variable:meta_description="META Description Goes Here"} {!-- Page META keywords --} {assign_variable:meta_keywords="META Keywords Go Here"} {!-- Background image position --} {assign_variable:bg_position_left="560"} {assign_variable:bg_position_top="0"} {!-- Heading 1 image margins --} {assign_variable:h1_margin_top="30"} {assign_variable:h1_margin_right="0"} {assign_variable:h1_margin_bottom="40"} {assign_variable:h1_margin_left="0"} I can't put these in a global variables (with the possible exception of website_root - see other post for that!!) because they are different 'per template'. Cheers! Martin
  16. Sorted (using EE variables). I needed to pass the variable in the embed tag, and then use "embed:" before the variable name in the nested template. Slightly long winded, but I can see that it gives you very granular control over variables in templates. Main Template {!-- Main Template --} {assign_variable:martins_variable="THIS IS AN INTERESTING VARIABLE"} <html> <body> {embed="site/nested_template" martins_variable="{martins_variable}"} </body> </html> Embedded Template site/nested_template {!-- Nested Template --} The variable is {embed:martins_variable} Cheers! Martin
  17. Hi guys, I have come across an issue which I can't seem to work around in EE Core 1.6.8, using either PHP or EE template-level variables. I have a main template, with a nested template (a simplified version is shown below). Main Template {!-- Main Template --} <?php $martins_variable = "THIS IS AN INTERESTING VARIABLE"; ?> <html> <head> ...SNIP... </head> <body> {embed="site/nested_template"} </body> </html> Embedded Template site/nested_template {!-- Nested Template --} The variable is <?php echo $martins_variable; ?> PHP is enabled on every template (for now), and I have tried this parsing PHP at both input and output. It equally doesn't work with EE template-level variables using {assign_variable:martins_variable="THIS IS AN INTERESTING VARIABLE" in the main template and then calling it in the nested template with {martins_variable}. Is there a way around this? I would really like to be able to do this using one or the other method (it doesn't really matter which, but PHP would be preferable). I don't want to assign global variables in EE because I want to use these variables to assign things like background colours and CSS styles to different templates, so I need the variables in the "top level" templates. Many thanks, Martin
  18. Hi guys, I am designing my first blog at the moment, and while mocking things up in Photoshop, have noticed that the links in the sidebars (categories, archive months, blogroll etc.) are looking a bit... I don't know really - too much. Would it be generally accepted (despite being theoretically against usability standards) to NOT have links styled in a blog sidebar, given that most things in a sidebar ARE a link (and therefore assumed to be a link)? Whether I style links simply as underlined, or a different colour with no text decoration, the links just seem to not look quite right at the moment (because there are too many of them I think). Cheers! Martin
  19. Thank you Well I think based on that I answered my own question - I can't see any need for the "about", "most popular", "latest comments" and the like modules on an article page. I am planning to put any pertinent information to the article (related items, see also, links to items mentioned in the body text etc.) either at the end of the article or in floated boxes - I'm going for a bit of a magazine style design. Thanks! Martin
  20. Hi guys, I have looked at many (many!) blog designs recently, in an effort to gain inspiration for my own. One design I particularly like is the 3 column layout - main content (widest), sidebar right a (narrow), and sidebar right b (wider). However, this poses the question - when you get into the "inner pages" (ie the blog posts themselves rather than the front page intros), is it best to maintain the 3 column layout (with all the various information in them - about, most popular, latest comments etc.), or go to a 2 column layout, only showing the really important stuff (navigation, category list, archive links. The benefit of this is a wider main content area (which makes the flow of longer articles better, and gives more possibilities for full width images), whereas the drawbacks are that not all the "modules" (for want of a better word) are available on the inner pages. Is there a best practice or recommended design idea for this? Obviously I want to make the site as intuitive as possible, but I don't want to clutter the article pages with unnecessary information. The focus of the page has to be on the article. So, basically, is it better to have a single design for all pages - special full-width and "static" pages aside - or is it better to have an "index" page (used for home, and category/tag indexes) and an "inner page" (for articles)? I know it's a grey area, but any advice would be good. I'm new to the blogosphere (a bit late to the party maybe ) Cheers! Martin
  21. Thanks for that idea! I had thought about it, but any tests that I had done looked a bit "lightweight". Although you have given me an idea... The tagline for the site is "All About The Music", which is a logo based on various sizes of Hoefler and Frere-Jones' "Tungsten" and layered / messed around with. Putting *that* as the site heading and then "moderatomaestoso.com" underneath in a cursive italic looks pretty good. Time to mess around some more! This is jusy one of the many reasons why I could never do this professionally - I enjoy fiddling too much! M
  22. Hi guys, I am in the process of designing my blog, which will be all about the technical music aspects of musical theatre (musical direction, keyboard programming, orchestration, track production etc.) The website is called ModeratoMaestoso.com (Moderato Maestoso being the first tempo marking in the Les Misérables score - my favourite of the shows I've done ), and I am looking for a typeface for the masthead. Are there any unclichéd theatrical fonts around? "Broadway" is now so passé, as is (although less so) Bodoni. The design is cleanly-grungy(!) - grunge with plenty of white space, so a grunge-style (worn/destroyed) font would be quite good (although that could be done after the fact, the font itself doesn't need to be grunge). The nav menu is in "3rd Man", which I think looks awesome, but less so for headings. Commercial font ideas please - I don't want to have to get into licensing issues with non-commercial (freeware) fonts. It's a commercial site. Any ideas much appreciated! Many thanks, Martin
  23. Ah yes of course! Thank you!
  24. Thanks guys! That was originally how I had it, but I ended up with constructs like: body#about_me div#header a:hover { } body#about_me div#content a:hover { } And worse... Incredibly long cascades, which struck me as VERY clunky. However if that is the best way then so be it
  25. Hi guys, Is it frowned upon (in terms of standards / best practice) to embed page specific styles in an html page rather than create many external stylesheets and reference them? I have 7 or 8 styles which are page specific (heading 1, body colour, container div background, link colours etc), and it seems a bit wasteful on server calls to have to create css files for every page. But, I would like to stick to best practice (although not at the expense of common sense) Cheers, Martin

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.